Als «css-selectors» getaggte Fragen

Selektoren sind Muster, die mit Elementen in einem Dokumentbaum übereinstimmen. In einer CSS-Regel werden sie verwendet, um Stile für Elemente zu definieren, die dem Muster entsprechen.

2
Wählen Sie alle untergeordneten Elemente rekursiv in CSS aus
Wie können Sie alle untergeordneten Elemente rekursiv auswählen? div.dropdown, div.dropdown > * { color: red; } Diese Klasse wirft nur eine Klasse auf den definierten Klassennamen und alle unmittelbaren untergeordneten Elemente. Wie können Sie auf einfache Weise alle childNodes wie folgt auswählen: div.dropdown, div.dropdown > *, div.dropdown > * > …
407 css  css-selectors 
8
CSS: nicht (: letztes Kind): nach Selektor
Ich habe eine Liste von Elementen, die so gestaltet sind: ul { list-style-type: none; text-align: center; } li { display: inline; } li:not(:last-child):after { content:' |'; } <ul> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> <li>Five</li> </ul> Führen Sie das Code-Snippet ausHide resultsErweitern Sie das Snippet Ausgänge One | Two | Three | …
3
Wählen Sie ein Element basierend auf mehreren Klassen aus
Ich habe eine Stilregel, die ich auf ein Tag anwenden möchte, wenn es zwei Klassen hat. Gibt es eine Möglichkeit, dies ohne JavaScript durchzuführen? Mit anderen Worten: <li class='left ui-class-selector'> Ich möchte meine Stilregel nur anwenden, wenn lisowohl beide .leftals auch .ui-class-selectorKlassen angewendet wurden.
360 css  css-selectors 
10
jQuery erstes Kind von "this"
Ich versuche, "dies" von einem angeklickten Bereich an eine jQuery-Funktion zu übergeben, die dann jQuery für das erste untergeordnete Element des angeklickten Elements ausführen kann. Kann es nicht richtig machen ... <p onclick="toggleSection($(this));"><span class="redClass"></span></p> Javascript: function toggleSection(element) { element.toggleClass("redClass"); } Wie verweise ich auf das: erste Kind des Elements?
6
Gibt es einen CSS-Selektor nur für das erste direkte Kind?
Ich habe das folgende HTML <div class="section"> <div>header</div> <div> contents <div>sub contents 1</div> <div>sub contents 2</div> </div> </div> Und der folgende Stil: DIV.section DIV:first-child { ... } Aus irgendeinem Grund, den ich nicht verstehe, wird der Stil sowohl auf den "Unterinhalt 1" <div> als auch auf den "Header" angewendet <div>. …
314 html  css  css-selectors 
7
Kann CSS die Anzahl der untergeordneten Elemente eines Elements ermitteln?
Ich beantworte wahrscheinlich meine eigene Frage, bin aber sehr neugierig. Ich weiß, dass CSS einzelne Kinder eines Elternteils auswählen kann, aber es gibt Unterstützung, um die Kinder eines Containers zu formatieren, wenn sein Elternteil eine bestimmte Anzahl von Kindern hat. beispielsweise container:children(8) { // style the parent this way if …
304 css  css-selectors 
7
CSS Child vs Descendant Selektoren
Ich bin ein bisschen verwirrt zwischen diesen beiden Selektoren. Hat der absteigende Selektor: div p Wählen Sie alle pinnerhalb eines, divob es sich um einen unmittelbaren Nachkommen handelt oder nicht. Wenn sich das palso in einem anderen befindet div, wird es trotzdem ausgewählt? Dann das Kind Selektor: div > p …
298 css  css-selectors 
5
Geben Sie in CSS mehrere Attributselektoren an
Wie lautet die Syntax für Folgendes: input[name="Sex" AND value="M"] Grundsätzlich möchte ich das inputElement auswählen , das das Attribut name="Sex"sowie das Attribut hat value="M": <input type="radio" name="Sex" value="M" /> Elemente wie die folgenden sollten nicht ausgewählt werden: <input type="radio" name="Sex" value="F" />
9
Wie kann ich gerade und ungerade Elemente stylen?
Ist es möglich, CSS-Pseudoklassen zu verwenden, um gerade und ungerade Instanzen von Listenelementen auszuwählen? Ich würde erwarten, dass Folgendes eine Liste alternierender Farben erzeugt, aber stattdessen erhalte ich eine Liste blauer Elemente: <html> <head> <style> li { color: blue } li:odd { color:green } li:even { color:red } </style> </head> …
281 html  css  css-selectors 
4
Wie kann ich Stile auf mehrere Klassen gleichzeitig anwenden?
Ich möchte, dass zwei Klassen mit unterschiedlichen Namen dieselbe Eigenschaft in CSS haben. Ich möchte den Code nicht wiederholen. .abc { margin-left:20px; } .xyz { margin-left:20px; } <a class="abc">Lorem</a> <a class="xyz">Ipsum</a> Führen Sie das Code-Snippet ausErgebnisse ausblendenErweitern Sie das Snippet Da beide Klassen dasselbe tun, sollte ich es zu einer …
276 css  css-selectors 
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.