Heim >Web-Frontend >CSS-Tutorial >Wie kann ich alle Elemente außer dem ersten „in einem' formatieren?

Wie kann ich alle Elemente außer dem ersten „in einem' formatieren?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-12-02 00:25:12925Durchsuche

How Can I Style All But the First `` Element Inside a ``?

Den „not:first-child“-Selektor effektiv nutzen

Beim Stylen von Elementen innerhalb eines Containers ist es oft notwendig, Regeln auf alle Elemente außer dem ersten anzuwenden. Für solche Szenarien ist es von entscheidender Bedeutung, zu verstehen, wie der Selektor „not:first-child“ effektiv genutzt wird.

In Ihrem Fall haben Sie versucht, CSS-Eigenschaften für jedes „ul“-Tag innerhalb eines „div“-Tags festzulegen. mit Ausnahme des ersten. Während Ihre Versuche erfolglos waren, funktioniert eine der Varianten, die Sie ausprobiert haben, tatsächlich in modernen Browsern:

div ul:not(:first-child) {
    background-color: #900;
}

Dieser Selektor nutzt CSS-Selektoren der Stufe 3 und zielt auf alle „ul“-Tags innerhalb von „div“, die nicht die ersten sind Kind.

Wenn Sie jedoch ältere Browser unterstützen müssen oder mit Einschränkungen des Selektors „:not“ konfrontiert sind, gibt es einen alternativen Ansatz verfügbar:

  1. Definieren Sie eine Regel mit größerem Geltungsbereich als beabsichtigt:
div ul {
    background-color: #900;  /* applies to every ul */
}
  1. Widerrufen Sie die Regel bedingt, um ihren Geltungsbereich auf die Zielelemente zu beschränken:
div ul:first-child {
    background-color: transparent; /* limits the scope of the previous rule */
}

Durch die Rückkehr zu den Standardattributen für die geänderten CSS-Eigenschaften können Sie die Regeln effektiv auf das Gewünschte einschränken Elemente.

Das obige ist der detaillierte Inhalt vonWie kann ich alle Elemente außer dem ersten „in einem' formatieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn