Verschachtelte Pseudoformate
Sebastian Haug
- css
0 sebastian0 Jochen Kubik0 romy0 CarstenP
Hallo!
Ich baue hier gerade an meiner Homepage und versuche die Formatierung auf vernünftige StyleSheets zu basieren um nicht überall die schrecklichen <font>-Tags zu haben.
Dazu verwende ich auch die Pseudoformate
a:link,
a:visited,
a:hover,
a:active.
Nun wollte ich aber meine Links in einem Teil meiner Page auf die eine Art formatieren und in einem anderen Teil auf eine andere.
Kurz hier nachgelesen und ich dachte ich hätte es, indem ich zwei verschiedene a-Formatierungen erstelle, jeweils in Abhängigkeit vom direkt übergeordneten Element.
Also:
p > a:link { ...}
p > a:visited { ...}
p > a:hover { ...}
p > a:active { ...}
td > a:link { ...}
td > a:visited { ...}
td > a:hover { ...}
td > a:active { ...}
Dies scheint aber so NICHT zu funktionieren (auch wenn ich keinen zwingenden Logikfehler darin sehen kann).
Meine Frage ist also nun, ob ich hier einen Fehler gemacht habe, oder ob die Kombination von Verschachtelung und Pseudoformaten einfach nicht unterstützt wird - wenn dem so ist wäre ich für Tips dankbar, wie man dies elegant lösen kann.
(Und nicht in jeden <a>-Tag noch einen <font>-Tag setzen muss...)
Hoffentlich kann mir jemand helfen,
Sebastian Haug
Hallo!
Ich baue hier gerade an meiner Homepage und versuche die Formatierung auf vernünftige StyleSheets zu basieren um nicht überall die schrecklichen <font>-Tags zu haben.
Dazu verwende ich auch die Pseudoformate
a:link,
a:visited,
a:hover,
a:active.
Nun wollte ich aber meine Links in einem Teil meiner Page auf die eine Art formatieren und in einem anderen Teil auf eine andere.
Kurz hier nachgelesen und ich dachte ich hätte es, indem ich zwei verschiedene a-Formatierungen erstelle, jeweils in Abhängigkeit vom direkt übergeordneten Element.
Also:
p > a:link { ...}
p > a:visited { ...}
p > a:hover { ...}
p > a:active { ...}
td > a:link { ...}
td > a:visited { ...}
td > a:hover { ...}
td > a:active { ...}
Dies scheint aber so NICHT zu funktionieren (auch wenn ich keinen zwingenden Logikfehler darin sehen kann).
Meine Frage ist also nun, ob ich hier einen Fehler gemacht habe, oder ob die Kombination von Verschachtelung und Pseudoformaten einfach nicht unterstützt wird - wenn dem so ist wäre ich für Tips dankbar, wie man dies elegant lösen kann.
(Und nicht in jeden <a>-Tag noch einen <font>-Tag setzen muss...)
dieses format (p > a:...) hab ich noch nie gesehen :) aber es gibt ja noch die möglichkeit:
a.tag {color:white}
a.nacht{color:black}
<a class=tag href="#">Tag</a>
<a class=nacht href="#">Nacht</a>
mfg sebastian
Hi Sebastian,
ich mach das immer so:
a.nav:link {......}
a.nav:visited {....}
<a class="nav" href="..."></a>
so kannst Du beliebug viele classen definieren.
Viele Grüße aus Ludwigsburg
Hallo!
Ich baue hier gerade an meiner Homepage und versuche die Formatierung auf vernünftige StyleSheets zu basieren um nicht überall die schrecklichen <font>-Tags zu haben.
Dazu verwende ich auch die Pseudoformate
a:link,
a:visited,
a:hover,
a:active.
Nun wollte ich aber meine Links in einem Teil meiner Page auf die eine Art formatieren und in einem anderen Teil auf eine andere.
Dies scheint aber so NICHT zu funktionieren (auch wenn ich keinen zwingenden Logikfehler darin sehen kann).
Meine Frage ist also nun, ob ich hier einen Fehler gemacht habe, oder ob die Kombination von Verschachtelung und Pseudoformaten einfach nicht unterstützt wird - wenn dem so ist wäre ich für Tips dankbar, wie man dies elegant lösen kann.
(Und nicht in jeden <a>-Tag noch einen <font>-Tag setzen muss...)
-->zu Deiner direkten Frage kann ich nichts sagen, aber ich denke es gibt eine elegane Lösung für das Problem, erstelle einfach Klassen für die verschiedenen links,
zB.
du kreierst den standartlink, so wie du es schon gemacht hast, also
a {blabla }
a:link,
a:visited,
a:hover,
a:active.
und dann setzt du einfach ein
.meinKlassenName { } und schreibst die Veränderungen da rein
und bindest das im HTML wie folgt ein
<a href="blabla.de" class="meinKlassenName">hsad</a>
schon die 3. antwort in der exakt das gleiche steht (inhaltlich).
wie wäre es, vorher die gegebenen antworten zu lesen? :O)
mfg sebastian
-->zu Deiner direkten Frage kann ich nichts sagen, aber ich denke es gibt eine elegane Lösung für das Problem, erstelle einfach Klassen für die verschiedenen links,
zB.
du kreierst den standartlink, so wie du es schon gemacht hast, also
a {blabla }a:link,
a:visited,
a:hover,
a:active.
und dann setzt du einfach ein
.meinKlassenName { } und schreibst die Veränderungen da rein
und bindest das im HTML wie folgt ein
<a href="blabla.de" class="meinKlassenName">hsad</a>
Danke euch allen für die schnelle Antwort - auf das mit den Klassen hätte ich ja irgendwo schon selbst kommen können *schäm* ;)
Trotzdem hätte mich noch interessiert, ob nicht die Verschachtelung doch funktioniert - meiner Meinung nach wäre das eine noch wesentlich bessere Lösung, da bei der Klassen-Methode wieder in jedem <a>-Tag die Klasse angegeben werden muss. (Akzeptabel, aber nicht ideal ;)
Hallo Sebastian,
laß mich raten. Du benutzt den IE? Schau Dir mal das Beispiel in SelfHTML genau an und Du wirst feststellen daß gerade Dein Beispiel im IE nicht funktioniert (so wie übrigens viele andere schöne CSS-Sachen mit dem IE nicht funktionieren :-( ).
Laß in deinem Code das ">" raus und schreib nur p a:link u.s.w. (das ist im Prinzip das Gleiche, nur daß es allgemeiner alle a's innerhalb von p (bzw. td) umfaßt, auch die tieferen Ebenen).
An all die anderen: die Verwendung von Klassen ist zwar im Prinzip auch richtig, aber wenn man weiß, daß Formatierung 1 nur innerhalb von p vorkommt und Vormatierung 2 nur innerhalb von td, dann ist dies die elegantere Variante (man muß nicht für jeden Link <a class="..."> schreiben...).
Viele Grüße
Carsten
Hallo Sebastian,
laß mich raten. Du benutzt den IE? Schau Dir mal das Beispiel in SelfHTML genau an und Du wirst feststellen daß gerade Dein Beispiel im IE nicht funktioniert (so wie übrigens viele andere schöne CSS-Sachen mit dem IE nicht funktionieren :-( ).
Laß in deinem Code das ">" raus und schreib nur p a:link u.s.w. (das ist im Prinzip das Gleiche, nur daß es allgemeiner alle a's innerhalb von p (bzw. td) umfaßt, auch die tieferen Ebenen).
An all die anderen: die Verwendung von Klassen ist zwar im Prinzip auch richtig, aber wenn man weiß, daß Formatierung 1 nur innerhalb von p vorkommt und Vormatierung 2 nur innerhalb von td, dann ist dies die elegantere Variante (man muß nicht für jeden Link <a class="..."> schreiben...).
Viele Grüße
Carsten
Vielen, vielen Dank !
Klappt wunderbar.
Und überhaupt sollte man IE weltweit verbieten ;)
Nochmals Danke,
Sebastian