Wie kann ich mit nth-child() in Internet Explorer 8 Zebrastreifen in Tabellen erreichen?

CSS-Unterstützung für nth-child() in Internet Explorer 8

In modernen Browsern ist das CSS-Element nth-child() häufig anzutreffen Wird verwendet, um Zebrastreifeneffekte in Tabellen zu erzielen. Diese Funktionalität fehlt jedoch insbesondere in Internet Explorer 8. So beheben Sie diese Einschränkung:

Polyfill-Ansatz:

Selectivizr ist ein etabliertes Polyfill, das Internet Explorer effektiv erweitert CSS-Unterstützung. Durch die Implementierung von Selectivizr können Sie nth-child() in Ihren CSS-Stilen verwenden.

Ohne Polyfills:

Die Unterstützung des Internet Explorer 8 für den First-Child-Selektor bietet eine Möglichkeit, die Funktionalität von nth-child() zu emulieren:

/*li:nth-child(2)*/
li:first-child + li {}

Mit diesem Ansatz können Sie Stile für das zweite li-Element angeben. ahmt effektiv das Verhalten von nth-child(2) nach.

Einschränkungen:

Dieser Emulationstrick funktioniert zwar für einfache Selektoren wie nth-child(2), funktioniert aber nicht kurz, wenn es um komplexere Ausdrücke wie nth-child(2n 1) oder nth-child(odd) geht. Internet Explorer 8 ist nicht in der Lage, die differenzierte Funktionalität dieser Selektoren zu reproduzieren.

Das obige ist der detaillierte Inhalt vonWie kann ich mit nth-child() in Internet Explorer 8 Zebrastreifen in Tabellen erreichen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!