Sven Rautenberg: Link und Hover Definitionen

Beitrag lesen

Yo!

Also dass in einer Tabelle dann mal links gelb sind, und in nem anderen Teil der Tabelle links grpn sind?

a:link    { /* styles für alle Links */ }
a:visited { /* styles für alle Links */ }
a:focus   { /* styles für alle Links */ }
a:hover   { /* styles für alle Links */ }
a:active  { /* styles für alle Links */ }

table#id a:link    { /* styles für alle Links in der Tabelle id */ }
table#id a:visited { /* styles für alle Links in der Tabelle id */ }
table#id a:focus   { /* styles für alle Links in der Tabelle id */ }
table#id a:hover   { /* styles für alle Links in der Tabelle id */ }
table#id a:active  { /* styles für alle Links in der Tabelle id */ }

Funktioniern nicht. Warum? Weil der Selektor "table#id a" folgendes Konstrukt selektiert:
<table id="id"><a href="link">Linktext</a></table>

Aber nicht:
<table id="id"><tr><td><a href="link>Linktext</a></td></tr></table>

Variante 1 ist aber kein valides HTML und dürfte daher eher selten anzutreffen sein.

Besser:
td.klasse a:link { ... }

und
<td class="klasse">Text <a href="link">Linktext</a> Text</td>

Warum eine Klasse und keine ID? Netscape 4 versteht nur allgemeine ID-Definitionen mit "#id {...}", aber keine speziell ans Tag gebundene Definition wie "div#id { ... }". Die Variante mit Klassen ist da weitaus besser.

Wenn aber wirklich nur die Tabelle eine ID hat, und irgendwo innerhalb der Tabelle ein Link deshalb speziell formatiert werden soll, dann geht auch folgender Selektor:
table#id * a:link {...}

Das Sternchen steht (wenn SelfHTML korrekt ist) für beliebig viele Zwischentags (in diesem Fall also <tr> und <td>). Nachteil: Netscape 4 versteht das nicht. Sowas ist also eine interessante Möglichkeit, CSS-Angaben vor Netscape 4 zu verstecken (genauso wie die explizite Tag-Angabe bei IDs oben).

- Sven Rautenberg