css hover effekt geht nicht...warum?

...komplette Frage anzeigen

4 Antworten

Soweit ich weis, ist :hover nicht alleine einer CLASS zuordnungsfähig, es muss der HTML-Tag angegeben sein.

div.navigation_schrift:hover{
    color: green;
}

mit dem div-Container zusammen sollte das dann funktionieren.

BluBbmADe 07.08.2011, 22:01

Jetzt funktioniert es.

Warum das weder auf SelfHTML noch in verschiedenen Tutorials erwähnt wird ist mir schleierhaft.

Vielen Dank!

1

Hi. Mein Beitrag zur Klärung / Ergänzung:

Steffile geht wahrscheins davon aus, dass es vor allem Sinn macht, Links bzw. "Anker" mit :hover zu bestücken. Und weil das Anker-Element in HTML mit "a" notiert wird, kam wohl der Vorschlag.

.navigationschrift a wäre irgend ein Link in einem klassifizierten Element (zB "DIV", "UL" oder "LI"), welches die Klasse navigationschrift hat.

<div class="navigationschrift" style="…irgendwas…">
    <a id="zuFormatierenderAnker">Linkt-Text</a>
</div>

Dabei wäre es egal, wie tief die Schachtelung gehen muss, bis das "A"-Element angesprochen wird. Jedenfalls macht das Leerzeichen in diesem Vorschlag Sinn.

Um ein "A"-Element direkt eine Ebene unterhalb von ".navigationschrift" anzusprechen, müsste es so notiert werden:

.navigationschrift>a {
    …irgendwelche Styles für normale Links
} /* oder auch mit Leerzeichen, das ist egal */
.navigationschrift > a:hover {
    color: green;
}

Dein Vorschlag a.navigationschrift würde bedeuten, dass das "A"-Element selbst die Klasse "navigationschrift" hat. Klasse und Element sind also "auf gleicher Ebene". Das Beispiel von Steffile hingegen hat mit Vererbung zu tun, dem Grundkonzept von CSS.

a.* oder a.[Leerzeichen] können nicht funktionieren, weil dies zwei Zeichen sind, mit denen eine CSS-Klasse nicht beginnen darf.


So. Jetzt mal was GANZ anderes…:

Es kann in bestimmten Fällen dazu kommen, dass :hover ignoriert wird, wenn die Reihenfolge der Notaton von Pseudoklassen nicht eingehalten wird. Diese ist:

:link – :visited – :focus – :hover – :active

siehe dazu auch http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active

BluBbmADe 07.08.2011, 23:21

Bei meinem a.* war das "*" nur als Platzhalter für die nachfolgende Class gedacht :D

Das da kein Leerzeichen stehen darf is auch mir klar.

Mit Leerzeichen meinte ich nur das Leerzeichen hier:

.navigationschrift a:hover

(Leerzeichen lassen sich so schlecht fett darstellen ;-))

Das GANZ andere is auch GANZ wichtig!

Danke dafür!

0
derwendtde 07.08.2011, 23:34
@BluBbmADe

Ah jetzt ja! …Eine Insel… Dann wären ja alle Klarheiten beseitigt und alle sind glücklich :-)

0
CodeFlatter 08.08.2011, 10:58

Sauber, DH! War auch für mich noch an einer Stelle lehrreich. Ich bedanke mich auch. :-)

0

versuchs mal mit .navigationschrift a & .navigationschrift a:hover, d.h. benutz a.

BluBbmADe 07.08.2011, 21:54

was meinst du mit a?

a.navigationschrift?

leerzeichen werden gar nicht akzeptiert...

a.* wird auch nicht akzeptiert ... es wäre nett wenn du dich genauer ausdrücken könntest, da die aus deiner antwort resultierenden möglichkeiten doch sehr viel interpretationsspielraum lassen

0

Hi BluBbmADe! :) (toller Name!:)

Erstens: "font-family: courir" -> Bessere diesen Punkt in "courier" aus.Fehler verzeiht CSS nicht ;)

Zweitens: "text-align: center" -> Vergiss niemals mit ";" abzuschließen, sonst "rechnet" das Stylesheet weiter ohne den Befehl auszuführen!

Drittens: das "text-decoration: none;" weglassen.

Die Hover-Funktion stimmt soweit. Viel Glück und gib bescheid ob es geholfen hat!

:)

BluBbmADe 12.08.2011, 17:45

Die Fontfamlily funktioniert einwandfrei ...?

warum drittens?

Ich will keine Textdecoration...

0

Was möchtest Du wissen?