|
|
 |
|
|
|
HTML Links : ADVANCEREDE TEKSTLINKS
|
I stedet for bare at slå understregningen fra på alle links, kan du være mere specifik i din måde, hvorpå du definerer, hvordan du ønsker, at dine links skal fungere.
I eksemplet nedenfor er understregningen af links slået fra.
Det viste A:hover fortæller browseren, at når musen er over linket, skal understregningen vises. Hover-muligheden fungerer kun i MSIE 4+ (men den forårsager ikke en fejl i Netscape, hvis du indsætter den - effekten vises bare ikke.).
<html>
<head>
<title>Dette er min side</title>
<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>
Velkommen til min verden!<br>
<a href="http://www.yahoo.dk>Dette link til Yahoo er ikke understreget</a>
</body>
</html>
|
Metoden nævnt ovenfor vil slå understregningseffekten fra på links på hele siden.
Hvis du vil slå effekten fra på et enkelt link, skal du indsætte en style-egenskab i <a href>-tagget:
<a href="http://www.yahoo.dk" style="text-decoration: none">Gå til Yahoo</a>
|
NB:
De beskrevne metoder fungerer kun i MSIE 3, Netscape 4 eller nyere browsers.
Du kan lave mange forskellige style-opsætninger i stedet for blot at fjerne understregningen. Hvorfor ikke også definere de farver, du vil have på besøgende links?
Dette eksempel viser dig, hvordan du gør:
<html>
<head>
<title>Dette er min side</title>
<STYLE TYPE="text/css"><!--
A.set1:link {color: #FF00FF; }
A.set1:active {color: #FFFF00; }
A.set1:visited {color: #00FFFF; }
A.set2:link {color: #AA00FF; background: FF00AA; text-decoration: none}
A.set2:active {color: #FF00AA; background: none transparent;}
A.set2:visited {color: #FFFF00; text-decoration: none}
--></STYLE>
</head>
<body>
Velkommen til min verden!<br>
<a href="http://www.yahoo.dk CLASS=set1> Yahoo </a>
<a href="http://www.hotbot.com CLASS=set2> Hotbot </a>
</body>
</html>
|
Prøv at føre musen henover - eller enddog klikke på de to links nedenfor for at se, hvordan disse effekter fungerer (links er deaktiveret på denne side).
|
|
| |
|
KURSER 
