class soll div Angabe überschreiben
maggie
- css
0 1UnitedPower0 maggie0 1UnitedPower0 1UnitedPower0 Maggie0 1UnitedPower0 1UnitedPower0 Maggie
0 1UnitedPower
Hallo,
wie muss die CSS Anweisung für eine definierte class .first
.first a:link, .first a:visited {
color:#095197;
}
aussehen, um diese div Anweisung
#mainNav ul.menu li a:link, #mainNav ul.menu li a:visited {
color: #000000;
}
zu überschreiben.
Danke für einen Tipp.
Maggie
.first a:link, .first a:visited {
color:#095197 !important;
}
Oder zu benutzt einen Selektor mit höherer Spezifität.
.first a:link, .first a:visited {
color:#095197 !important;
}
>
> Oder zu benutzt einen Selektor mit höherer Spezifität.
!important greift leider nicht, aber wenn ich's auf die 'li' ausweite, sollte es doch genau spezifiziert sein - aber leider zeigt sich damit auch nicht die richtige Farbe
~~~css
.first ul.menu li a:link,
.first ul.menu li a:visited
{
color:#095197;
}
:-( Maggie
PS: Es gibt auch einen first-child-Selektor.
PS: Es gibt auch einen first-child-Selektor.
Danke sehr, für die präzisen Ausführungen.
Die 'child' Möglichkeiten sind ja sehr interessant. Dann müsste bei
li:first-child {color:red;}
jeder 1. Listeneintrag in roter Schrift gezeigt werden!?
Bei meiner gewünschten Anweisung habe ich so meine Probleme, besonders mit der Link Angabe:
ul .menu li:first-child a:link
{
color:#095197;
}
Warum die 1. Anweisung nicht gegriffen hat, liegt wohl daran das noch eine Verschachtelung dazu kommt.
<div id="mainNav">
<li id="verband">
<div class="moduletable">
<ul class="menu">
<li class="item-112">
<a class="first" href="/index.php/dequs">Name</a>
#mainNav li.verband .moduletable ul.menu li:first-child a:link,
#mainNav li.verband .moduletable ul.menu li:first-child a:visited {
color:#095197;
}
Müsste hier das a:link an einer anderen Stelle stehen?
Gruß
Maggie
Die 'child' Möglichkeiten sind ja sehr interessant. Dann müsste bei
li:first-child {color:red;}
jeder 1. Listeneintrag in roter Schrift gezeigt werden!?
Soweit diese Regeln nirgendwo anders überschrieben werden - ja.
<div id="mainNav">
<li id="verband">
<div class="moduletable">
<ul class="menu">
<li class="item-112">
<a class="first" href="/index.php/dequs">Name</a>
Outch, wieso das zusätzliche li-Element? Listeneinträge gehören in Listen.
>#mainNav li.verband .moduletable ul.menu li:first-child a:link,
>#mainNav li.verband .moduletable ul.menu li:first-child a:visited {
> color:#095197;
>}
>Müsste hier das a:link an einer anderen Stelle stehen?
Nein, aber ich glaube du wolltest "li#verband" (mit Raute) schreiben.
Ark, beim zweiten lesen fällt natürlich immer nochmal was auf.
Warum die 1. Anweisung nicht gegriffen hat, liegt wohl daran das noch eine Verschachtelung dazu kommt.
Die Verschachtelungstiefe ist deinen Selektoren egal, da du den Nachfahren-Selektor (" ", Leerzeichen) verwendest und nicht den Kind-Selektor (">"). Tu dir aber selbst einen Gefallen und versuche deine Selektoren so einfach wie möglich zu halten, du musst nicht für jedes Element die gesamte Verschachtelungstiefe ab dem html-Wurzelelement im Selektor mitschleppen.
Die Verschachtelungstiefe ist deinen Selektoren egal, da du den Nachfahren-Selektor (" ", Leerzeichen) verwendest und nicht den Kind-Selektor (">"). Tu dir aber selbst einen Gefallen und versuche deine Selektoren so einfach wie möglich zu halten, du musst nicht für jedes Element die gesamte Verschachtelungstiefe ab dem html-Wurzelelement im Selektor mitschleppen.
...ja, mir ist nicht klar, wie weit ich zurückgreifen muss, um eindeutig die gewünschte Angabe zu machen - deshalb hatte ich die Klasse .first vergeben und dachte, dass ich nur diese Klasse ansprechen muss um den gewünschten Effekt zu erzielen.
li#verband .moduletable ul.menu li:first-child a:link {color:red;}
Gruß
Maggie
wenn ich's auf die 'li' ausweite, sollte es doch genau spezifiziert sein
Abder der vemeintlich allgemeinere Selektor beinhaltet einen id-Selektor, damit hat er automatisch eine höhere Spezifität als jeder andere Selektor ohne id-Selektor. Wie man die Spezifität berechnet ist gut aus der Spezifikation zu entnehmen.