|
Links sollen NICHT unterstrichen dargestellt werden und
beim Mouse Over soll die Linkfarbe wechseln.
<html>
<head>
<style type="text/css">
a:link{
color:#00CC66;
text-decoration:
none
}
a:visited{
color:#ff0000;
text-decoration:
none
}
a:hover{color:#f00000;
text-decoration:
none
}
a:active{color:#f00000;
text-decoration:
none
}
</style>
</head>
<body>
<a href="dein_link.html">Dein Link</a>
</body>
</html>
Erklärungen:
a:link
definiert das Aussehen des Links wenn nichts passiert,
also die Mouse ausserhalb des sensitiven Bereichs des
Links ist.
Mit dem Attribut color:
#00CC66 wird die Farbe festgelegt.
a:hover definiert
das Aussehen des links, wenn der Internet-User mit der
Mouse über den Link fährt.
Mit
dem Attribut color: #FF0000 wird
die Farbe festgelegt.
a:active
definiert das Aussehen des Links, wenn der Link aktiviert
wird, also - wenn der User auf den Link klick.
Mit dem Attribut color:
#F00000 wird die Farbe festgelegt.
a:visited
definiert das Aussehen des Links, wenn der User den
Link schon einmal mit dem Browser aufgerufen (oder besucht)
hat.
Mit dem Attribut color:
#000000 wird die Farbe festgelegt.
text-decoration:
none heisst in diesem Fall, das der Link-Text
nicht unterstrichen werden soll.
Das Ergebnis:
Könnte so aussehen, wie
auf dieser Seite die linke Navigationsleiste.
Im nächsten Beispiel
möchte wir mit CSS erreichen, das Unsere Links
nicht unterstrichen dargestellt werden, und das sich
die Linkhintergrundfarben beim Mouse
Over verändern.
|
