CSS
- Links (nicht) unterstreichen, Farbe ändern...
<html>
<head>
<style type="text/css">
A:link { text-decoration: none; }
A:visited { text-decoration: none; }
A:active { text-decoration: none; }
A:hover { text-decoration: underline; }
</style>
</head>
<body>
<a href="link.html">Link</a>
</body>
</html>
Beispielseite |
Im <head> Teil kann per CSS definiert werden,
wie die Links im Browser dargestellt werden. Standart ist, dass Links zu jeder
Zeit unterstrichen werden (link, visited, active, hover auf underline). Dies
kann beliebig geändert werden.
text-decoration:
none; = Keine Unterstreichnung
text-decoration:
underline; = Link wird unterstrichen
link
= normale Link-Anzeige
visited
= bereits besuchter Link
active
= grade angeklickter Link
hover
= Überfahren eines Links
Dies bewirkt, dass alle Links in der Seite gleich behandelt
werden. Sollen einzelne Links anders behandelt werden, so kann man dies folgendermaßen
erreichen:
<html>
<head>
<style type="text/css">
.komplex:link { text-decoration: none;}
.komplex:visited { text-decoration: none;}
.komplex:active { text-decoration: none;}
.komplex:hover {
text-decoration: underline;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
color: #00FF00;
background: #660000;
}
</style>
</head>
<body>
<a
href="link.html" class="komplex">Link</a>
<a href="link2.html">Link der 'normal' behandelt wird</a>
</body>
</html>
Beispielseite
|
Hier kann mittels class="komplex"
die Darstellung eines Links verändert werden.
text-decoration:
none; = Keine Unterstreichnung
text-decoration:
underline; = Link wird unterstrichen
font-family:
Verdana, Arial, Helvetica, sans-serif; = Schriftart(en)
font-size:
10pt; = Schriftgröße in Punkt
color:
#00FF00; = Schriftfarbe als Hex-Wert
background:
#660000; = Hintergrundfarbe als Hex-Wert
Dies
kann nun natürlich beliebig verändert (z.B. Art, Farbe & Größe)
und kombiniert werden (auch mir dem ersten Beispiel).
= Partnerlink