a:hover funktioniert nicht!
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anweisung
auszug
code
datei
definition
effekt
element
fehler
funktionieren
grad
kleines problem
links blau bleiben
mache
maus
opus
problem
sagen
text
toll beitrag
verlaufen
-
Hi,
ich habe ein kleines Problem:
Auf einer Website sollen die Links in der Navigationsleiste schwarz werden, wenn man mit der Maus drüberfährt. Nur leider funktioniert das irgendwie nicht so richtig.
In der HTML-Datei:
<tr><td class="navig"><p> <a href="http://www.tomasmueller.co.cc/">Testlink 1</a> | <a href="http://www.member-zone.co.cc/">Testlink 2</a></p></td></tr>
In der style.css:
td.navig a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} td.navig a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
Was mache ich da falsch dass die Links blau bleiben und nicht schwarz werden wenn man mit der Maus draufzeigt? -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Soll das da nur für Navi gelten oder für die ganze Seite?
mach mal #000000 hin und nicht #000
oder schreib da mal black rein.
Kannste das noch mal formatieren.
Der Werbebalken blockiert einen Teil deines Posts und das stört.
-
Gegen den Werbebalken kann ich nix machen, bei mir stört der nicht.
Also nochmal unter dem Werbebalken^^
ich habe ein kleines Problem:
Auf einer Website sollen die Links in der Navigationsleiste schwarz werden, wenn man mit der Maus drüberfährt. Nur leider funktioniert das irgendwie nicht so richtig.
In der HTML-Datei:
<tr><td class='navig'><p> <a href='http://www.tomasmueller.co.cc/'>Testlink 1</a> | <a href='http://www.member-zone.co.cc/'>Testlink 2</a></p></td></tr>
In der style.css:
td.navig a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} td.navig a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
Was mache ich da falsch dass die Links blau bleiben und nicht schwarz werden wenn man mit der Maus draufzeigt?
Beitrag geändert: 3.11.2008 20:08:59 von deutscher -
Vllt probierste erstmal #000000 oder black aus.
Dann könntest du noch das td. wegmachen.
Ich glaub das macht keinen Unterschied wenn du es da dran lässt oder wegnimmst.
-
:( Funzt alles net
Es muss doch irgendein Fehler am Code sein oder so ... sonst würde das doch funktionieren!
Ich finde aber keinen! Auch der W3C-Validator sagt nur: XHTML ist valide, CSS ist valide.
Toll!
Beitrag geändert: 3.11.2008 20:23:16 von deutscher -
Also hast du das überhaupt eingbeunden ^^
<link rel="stylesheet" href="style.css">
Oder sonst
<style>
</style> -
eragon95 schrieb:
Also hast du das überhaupt eingbeunden ^^
<link rel='stylesheet' href='style.css'>
Oder sonst
<style>
</style>
natürlich hab ich das eingebunden
-
Toll, du hast anscheinen <table></table> vergessen
-
td.navig p a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} td.navig p a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
oder du löschst das <p> aus dem html-Source!
Nicht getestet, aber müsste das Problem sein...
-
Ich hab das eben grad getestet.
Ohne <table> ging das nicht, als ich das hinzugefügt habe, ging es :D
-
Kein Wunder das folgendes nicht funktioniert:
td.navig a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} td.navig a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
Damit selektierst du die Klasse navig innerhalb eines TDs, hast aber darin kein Element mit der Klasse navig. Dies müsste dann so aussehen:
<table> <tr> <td> <div class="navig"> <a href="#">Link wird selektiert</a> </div> </td> </tr> </table>
Du könntest das zB so lösen:
.navig a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} .navig a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
<table class="navig"> <tr> <td> <a href="#">Link wird selektiert</a> </td> </tr> </table> -
Kein Wunder das folgendes nicht funktioniert:
td.navig a {font-size:12pt; font-weight:bold; color:#00F; text-decoration:underline;} td.navig a:hover {font-size:12pt; font-weight:bold; color:#000; text-decoration:underline;}
Damit selektierst du die Klasse navig innerhalb eines TDs, hast aber darin kein Element mit der Klasse navig.
Damit selektiert man das Element `a`, das sich in ein `td` Element mit der Klasse `navig` befindet.
Dass es nicht funktioniert, ist ein bisschen komisch… Hast du noch andere Definitionen für a (z.B. #content a)? Vll überschreiben sie diese Definition.
td.navig a { font-size: 12pt; font-weight: bold; color: #00F; text-decoration: underline; } td.navig a:hover { color: black; }
Ansonsten müsste diese Anweisungen funktionieren.
Ryan
-
Also, ich kann nur sagen, dass es im Opera funktoniert, wenn ich auf deine Testseite gehe. Der liebe FF ist da manchmal ein bisschen anstrengend, da er die Definitionen ganz genau haben will. Allerdings müsste es so wie staymyfriend gesagt hat gehen. Einfach das p mit in das Stylesheet schreiben. Außerdem würde ich nicht nur a, sondern a:link und a:visited als normalen Link verwenden, sowie a:hover und a:focus für den Effekt.
-
Also, ich kann nur sagen, dass es im Opera funktoniert, wenn ich auf deine Testseite gehe.
Huch, ich habe die Testseite grad eben gefunden und es funktioniert in Firefox 3.0.3 unter Mac genauso perfekt.
Beim Hover werden die Links schwarz. Das wolltest du doch erreichen, oder?
Ryan
Beitrag geändert: 7.11.2008 14:50:10 von ryanblack -
Ich musste nur meinen Verlauf löschen und schon hats funktioniert
Komisch. Wenn ich einen Link angeklickt habe, wird er ab diesem Zeitpunkt nicht mehr schwarz. Das bedeutet also, dass Opera a:visited vorzieht, wenn ein Link visited ist, ist Opera die Hover-Definition egal.
Gibt es also auch a:visited:hover und a:active:hover? Anders würde sich das Problem nicht lösen lassen...
Ich probiers einfach mal aus. -
Wenn du deinen Verlauf löscht ,ist das ja nicht mehr unter Visited, dann wird s nachtürlich zu der Farbe die du unter link angegben hast.
a:visited:hover müsste gehen.
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
