Link Onmouseover Unterstreichen
#1
geschrieben 31. Mai 2005 - 21:47
<style type="text/css">
:link, :visited { text-decoration: none };
:link:hover, :visited:hover { text-decoration: underline ! Important };
</style>
<style type="text/css">
a:hover { text-decoration: underline; }
</style>
unter Mozilla funkt es aber im InternetExplorer wird es nicht angezeigt
könnt ihr mir helfen?
///Info
///<style type="text/css">
///:link, :visited { text-decoration: none };
///:link:hover, :visited:hover { text-decoration: underline ! Important };
///</style>
///den Code hab ich gebraucht weil sonst in Mozilla jeder link unterstrichen gewäsen wäre
Anzeige
#2
geschrieben 31. Mai 2005 - 21:55
da fehlt das a vor den angaben
so muß das aussehen
Zitat
a:link, a:visited { text-decoration: none; }
a:hover { text-decoration: underline;}
</style>
Dieser Beitrag wurde von Flo bearbeitet: 01. Juni 2005 - 15:40
#3
geschrieben 01. Juni 2005 - 06:59
#4
geschrieben 01. Juni 2005 - 14:17
text-decoration:underline;
Standardmäßig ist es
text-decoration:none;
Dann kannst du Links noch "überstreichen" mit
text-decoration:overline;
und so weiter, da gibt es viele Möglichkeiten
Du brauchst übrigens nicht folgendes verwenden:
<style type="text/css"> a:link, a:visited { text-decoration: none }; a:hover { text-decoration: underline}; </style>
Sondern so ist es übersichtlicher und meiner Meinung nach besser:
<style type="text/css"> a { text-decoration:none; } a:hover { text-decoration:underline; } </style>
Ach ja und deine Semikolons waren auch falsch gesetzt @Flo
Erstens durch Nachdenken: Das ist der Edelste.
Zweitens durch Nachahmen: Das ist der Leichteste.
Drittens durch Erfahrung: Das ist der Bitterste.
(Konfuzius)
#5
geschrieben 01. Juni 2005 - 15:36
Zitat
CODE
text-decoration:none;
Standardmäßig ist es bei Links text-decoration:underline;.
#6
geschrieben 01. Juni 2005 - 15:39
Zitat
jo stimmt, hatte das kopiert und nicht drauf geachtet danke
#7
geschrieben 01. Juni 2005 - 17:58
hab das jetzt eingefügt funkt auch in Mozilla aber das problem ist dass es beim IE6 nicht funkt.
<style type="text/css">
a
{
text-decoration:none;
}
a:hover
{
text-decoration:underline;
}
</style>
#8
geschrieben 01. Juni 2005 - 19:05
Zitat (Party: 01.06.2005, 18:58)
hab das jetzt eingefügt funkt auch in Mozilla aber das problem ist dass es beim IE6 nicht funkt.
<style type="text/css">
a
{
text-decoration:none;
}
a:hover
{
text-decoration:underline;
}
</style>
<{POST_SNAPBACK}>
Also das geht auf jeden Fall, da bin ich mir zu 100% sicher.
Du solltest diesen Style in deinen head-Bereich tun.
Es muss also so aussehen:
<html> <head> <title>Seitentittel</title> <style type="text/css"> a { text-decoration:none; } a:hover { text-decoration:underline; } </style> </head> <body> <!-- dein HTML-Code --> </body> </html>
Das ist nur ein Beispiel, du kannst den Style auch extern nutzen und dann importieren, aber so muss es gehen.
Wenn du nun einen Link
<a href="http://winfuture.de" target="_blank">WinFuture</a>
in den body-Bereich machst, dann wird dieser in der normalen Anzeige ohne Unterstrich sein und beim Mouseover wird er unterstrichen.
Probiere es bitte noch einmal genau so.
@Floele
Ja, das ist mir schon klar
@Flo
Das kann mal passieren
Erstens durch Nachdenken: Das ist der Edelste.
Zweitens durch Nachahmen: Das ist der Leichteste.
Drittens durch Erfahrung: Das ist der Bitterste.
(Konfuzius)
#9
geschrieben 01. Juni 2005 - 20:17
wird wohl an meinem IE6 leigen der spinnt in letzter zeit eh.
ich probiers mal auf meinem laptop aber thx für die hilfe
#10
geschrieben 01. Juni 2005 - 20:19
Zitat (Party: 01.06.2005, 21:17)
wird wohl an meinem IE6 leigen der spinnt in letzter zeit eh.
ich probiers mal auf meinem laptop aber thx für die hilfe
<{POST_SNAPBACK}>
Keine Ursache.
aber ich kann dir versichern, dass es funktioniert
Also muss es an deinem IE liegen.
Bei mir geht es auch mit jedem Browser und der Code ist auch richtig so!
Viel Erfolg!
Übrigens: du kannst noch viel mehr mit dem Mouseover und den Links gestalten, wenn du Hilfe brauchst, schreib einfach ins Forum...
Erstens durch Nachdenken: Das ist der Edelste.
Zweitens durch Nachahmen: Das ist der Leichteste.
Drittens durch Erfahrung: Das ist der Bitterste.
(Konfuzius)
#11
geschrieben 01. Juni 2005 - 20:31
Zitat
<head>
<title>Seitentittel</title>
<style type="text/css">
a:link
{
text-decoration:none;
}
a:hover
{
text-decoration:underline;
}
</style>
</head>
<body>
<!-- dein HTML-Code -->
</body>
</html>
müsste es nicht so aussehen?
Dieser Beitrag wurde von Flo bearbeitet: 01. Juni 2005 - 20:31
#12
geschrieben 01. Juni 2005 - 20:41
Zitat (Flo: 01.06.2005, 21:31)
<{POST_SNAPBACK}>
Nein muss es nicht.
Es reicht a, man kann auch a:active,a:visited oder a:link
Aber a gilt allgemein für diese drei zusammen!
a:hover ist dann wieder was anderes...
Erstens durch Nachdenken: Das ist der Edelste.
Zweitens durch Nachahmen: Das ist der Leichteste.
Drittens durch Erfahrung: Das ist der Bitterste.
(Konfuzius)
#13
geschrieben 01. Juni 2005 - 20:42
a:link { text-decoration:underline; } a { text-decoration:none; } a:hover { text-decoration:none; }
Hier wird a:link und nicht a berücksichtigt, da es durch die Pseudoklasse eine höhere Spezifität hat. Ansonsten funktioniert aber sowohl a als auch a:link.
Hier macht es auch einen Unterschied:
a:link {border:solid 1px red;} a:visited {background:blue;}
a{border:solid 1px red;} a:visited {background:blue;}
Beim ersten Beispiel haben alle normalen Links (noch nicht besucht, nicht aktiv, etc.) einen roten Rand und alle besuchten Links einen blauen Hintergrund, beim 2. Beispiel haben alle Links einen roten Rand und die besuchten Links noch zusätzlich einen blauen Hintergrund.
Dieser Beitrag wurde von Floele bearbeitet: 01. Juni 2005 - 20:44
#15
geschrieben 01. Juni 2005 - 20:46
Zitat (Flo: 01.06.2005, 21:44)
<{POST_SNAPBACK}>
Genau!
Das wusste ich jetzt auch nicht...
Aber ich habe schon eine Erfahrung hier gemacht: von Floele lernt man sowieso nie aus
Erstens durch Nachdenken: Das ist der Edelste.
Zweitens durch Nachahmen: Das ist der Leichteste.
Drittens durch Erfahrung: Das ist der Bitterste.
(Konfuzius)