[HTML/CSS] Textfarbe von Links

Boron · 28. April 2008

Servus zusammen,

ich habe hier ein Problemchen, das ich mit meinen spärlichen HTML/CSS-Kenntnissen nicht gelöst bekomme.

Ich möchte, dass prinzipiell sämtliche Links in einer html-Datei schwarz dargestellt werden. Und zwar immer! Ob unbesuchte, besuchte, "gehoverte" oder sonst wie geartete Links.
Jetzt gibt es Bereiche in der Datei (bestimmte Zellen einer Tabelle), bei denen die Farbe immer weiß sein soll.
Wie kann ich diese "Ausnahmeerscheinung" definieren?

HTML:

<html>
  <head>
    <style type="text/css">
      a:link { color:black; }
    </style>
  </head>
  <body>
    <h1>
      4 Components
    </h1>
    <table border="1" bordercolor="#F0F0F0" bgcolor="#CCCCCC">
      <tr bgcolor="#999999">
        <th width="200">Module</th>
        <th bgcolor="#CCCCCC"></th>
        <th width="90">Testgroup</th>
        <th bgcolor="#CCCCCC"></th>
        <th width="90">VCar</th>
        <th width="90">Coverage</th>
        <th width="90">Misra</th>
        <th width="90">NamingRules</th>
        <th width="90">PolySpace</th>
        <th width="90">HW</th>
        <th width="90">IT</th>
        <th width="90">Review</th>
        <th bgcolor="#CCCCCC"></th>
        <th width="90">Result</th>
      </tr>
      <tr></tr>
      <tr></tr>
      <tr align="center">
        <th align="left"><a href="#2.1.1">can_drv.c</a></th>
        <td></td>
        <th><a href="#testgroup_Default">Default</a></th>
        <td></td>
        <td bgcolor="#CC0000" class="x"><a href="#2.1.1.1">Failed</a></td>
        <td bgcolor="#00AA00"><a href="#2.1.1.2">Passed</a></td>
        <td bgcolor="#CC0000"><a href="#2.1.1.3">Failed</a></td>
        <td bgcolor="#CC0000"><a href="#2.1.1.4">Failed</a></td>
        <td bgcolor="#CC0000"><a href="#2.1.1.5">Failed</a></td>
        <td bgcolor="#00AA00"><a href="#2.1.1.6">Passed</a></td>
        <td bgcolor="#00AA00"><a href="#2.1.1.7">Passed</a></td>
        <td bgcolor="#00AA00"><a href="#2.1.1.8">Passed</a></td>
        <td></td>
        <td bgcolor="#CC0000" style="color:white">Failed</td>
      </tr>
    </table>
  </body>
</html>

AndrewPoison · 28. April 2008

Code:

td a:hover {[I]Style[/I]}
th a {}
th a:hover {}

....

und so weiter. Müsstes schon gewesen sein

Also einfach das Tabellenelement vorher schreiben im Stylesheet, dann die ganzen Teile für die Links.

/edit:

hab mal nen Test gemacht:

Das ist die HTML-Datei:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<p><a href="#">Link 1</a></p>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><a href="#">Link in Tabelle</a></td>
  </tr>
</table>
</body>
</html>

...und das die Datei mit dem Stylesheet (style.css):

Code:

a {
    color: #333;
    text-decoration: none;
}

a:hover {
    color: #f00;
}

td a {
    color: #456789;
    text-decoration: none;
}

td a:hover {
    color: #123456;
}

Bei mir funzt es. Hab zwar dumme Farben zum testen genommen, aber mit guten Augen sieht mans auch so

Bei den Links gibt es übrigens:
a(:link), a:hover, a:visited und a:active, wenn ich mich recht entsinne. Du müsstest also deine Wunschfarbe für all diese Zustände deklarieren, einmal für "normale" Links und einmal für die in der Tabelle.

/und noch ein Edit: du musst für die jeweils 4 verschiedenen Zustände aber keine 4 Regeln definieren.

a, a:hover, a:visited, a:active {Style} kannst du auch schreiben. Und dann eben noch das ganze für th/td etc.

Boron · 28. April 2008

Das funktioniert schon mal. Vielen Dank

.
Kann man das auch irgendwie zur Zelldefinition dazuschreiben.
In der Form etwa: <td bgcolor=#CC0000 style="???">Failed</td>

Ziel ist, nur bestimmten Zellen die Linkfarbe zu geben. Sämtliche anderen Links sollen die "Standardfarbe" behalten.

AndrewPoison · 28. April 2008

Du kannst im HTML-Quelltext dem Link z.B. eine Klasse zuweisen, die du später mittels CSS anpasst:

HTML:

Code:

<td><a href="#" class="style1">Link in Tabelle</a></td>

CSS:

Code:

.style1 {
    color: #333333;
    font-weight: bold;
}

(der Punkt zu Beginn ist wichtig, die Style-Daten darin sind nur Testwerte)

claW. · 28. April 2008

wenn du mit tabellen arbeitest, verwende lieber klassen. es ist nämlich sehr wahrscheinlich dass sich irgendwas wiederholt (zumindest tabellen mit vergleichen o.ä.). außerdem sprengt es den eigentlichen code nicht.

bspw:

HTML:

<style type="text/css">
td.testa {
  background: #F00;
}
td.testb {
  background: #0F0;
}
td.testc {
  background: #00F;
}
</style>
<!-- ... -->
<table>
  <tr>
    <td class="testa">...</td>
    <td class="testa">...</td>
    <td class="testb">...</td>
    <td class="testa">...</td>
    <td class="testc">...</td>
  </tr>
</table>

inline kannst du das natürlich auch machen:

HTML:

...
    <td style="background: #F00;">...</td>
    <td style="background: #0F0;">...</td>
    <td style="background: #00F;">...</td>
...

Boron · 28. April 2008

Hervorragend.
Das mit der Klasse funktioniert perfekt.
Die gesamte Datei wird generiert (XSLT). Die generierte Dateigröße ist egal.

AndrewPoison · 28. April 2008

Jetzt nur noch brav alle gängigen Browser abstottern um zu gucken ob alle das genauso sehen

Boron · 28. April 2008

Das beschränkt sich in der Firma auf den IE6 (IE7 wird noch lange nicht verteilt) und einige wenige "unerlaubt" installierte FF

.

AndrewPoison · 28. April 2008

Hachja... immer die Firmen mit ihrem IE6. Überall das gleiche Bild

Naja dann noch Happy Coding. CSS-Referenzen findet man zu tausenden im Netz, aber so kleine Kniffe bekommt man häufig nur am Rande mit.

Crizzo · 29. April 2008

Boron schrieb:
Das beschränkt sich in der Firma auf den IE6 (IE7 wird noch lange nicht verteilt) und einige wenige "unerlaubt" installierte FF .

Die Leute, die dort surfen müssen, tuen mir wirklich leid...

Boron · 29. April 2008

Wir sollen ja auch nicht surfen, sondern Steuergeräte für PKWs entwickeln. Gesurft wird höchstens auf dem See

.

Suche

[HTML/CSS] Textfarbe von Links

Boron

Commander

AndrewPoison

Admiral Pro

Boron

Commander

AndrewPoison

Admiral Pro

claW.

Gast

Boron

Commander

AndrewPoison

Admiral Pro

Boron

Commander

AndrewPoison

Admiral Pro

Crizzo

Redakteur Pro

Boron

Commander

Ähnliche Themen