CSS Experiment: Sensible Tabellenrahmen

von Fries Websolutions

Wenn sich bei Mausberührung etwas bewegt, dann ist es ein klares Signal und bei den Hyperlinks ist das auch normal. Aber mit einer umständlicheren Anwendung, dann klappt es auch mit Tabellenrahmen.

Und der Trick dabei ist, das wir nicht die Tabelle verzieren, sondern nur den Inhalt. Denn es ist eigentlich ein Hyperlink, aber so formatiert, dass wir davon nichts sehen.

<table width="260" border="0" align="center" cellpadding="14"><tr><td><a href="#" class="text">Ich bin der Tabelleninhalt</a></td></tr></table>

Hier sorgt CSS den Rest und die Unterstreichung des Links wird beseitigt. Der Mauszeiger verändert sich mit der Pseudoklasse "Hover"und der Farbwechsel wird bei der Mausberührung beigefügt.

A:link {font-family: verdana; text-decoration: none; color: black; cursor: default; background-color: transparent; border: 1px solid black; padding: 12px; }
A:hover {font-family: verdana; border: 1px solid red;}