Warum verfügt CSS nicht über eine Funktion zur Gruppierung von Nachkommen?

Warum CSS-Selektoren keine Funktion zur Gruppierung von Nachkommen haben

In CSS kann das Zuweisen von Stilen zu einer Gruppe verschachtelter Elemente umständlich sein. Stellen Sie sich eine HTML-Tabelle vor, in der Sie alle Spaltenüberschriften und Zellen formatieren möchten. Sie müssen den folgenden Selektor verwenden:

<code class="css">#myTable th, #myTable td {}</code>

Es erscheint logisch, eine Syntax wie folgt zu haben:

<code class="css">#myTable (th, td) {}</code>

Historischer Kontext

Allerdings , eine solche Syntax existiert nicht, da bis 2008 kein Vorschlag dafür in Form der Pseudoklasse :any() gemacht wurde.

Frühe Browser-Implementierungen

Mozilla implementierte es erstmals 2010 als :-moz-any():

<code class="css">#myTable :-moz-any(th, td) {}</code>

WebKit schlug einen ähnlichen Ansatz mit :-webkit-any() vor:

<code class="css">#myTable :-webkit-any(th, td) {}</code>

Allerdings mit Beide Präfixe erforderten eine Duplizierung der Regelsätze, wodurch der Code überflüssig wurde.

Moderne Vorschläge

Der Selectors Level 4-Entwurf führt :matches():

<code class="css">#myTable :matches(th, td) {}</code>

Dieser Vorschlag befindet sich noch in der Entwicklung, wodurch die Browserunterstützung eingeschränkt ist.

Problemumgehung für Tabellenstil

Für Tabellen können Sie den universellen Selektor * verwenden, um sowohl th als auch td-Elemente:

<code class="css">#myTable tr > * {}</code>

Für eine bessere Leistung bevorzugen Sie möglicherweise immer noch die längere Form.

Das obige ist der detaillierte Inhalt vonWarum verfügt CSS nicht über eine Funktion zur Gruppierung von Nachkommen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!