Wie wähle ich das vorletzte Element in CSS aus?

CSS-Selektor für vorletztes Element

Bei der Verwendung von CSS ist es üblich, Elemente basierend auf ihrer Position innerhalb eines übergeordneten Elements auszuwählen. Während :last-child eine beliebte Wahl für die Auswahl des letzten Elements ist, gibt es eine Möglichkeit, das Element direkt vor dem letzten auszuwählen?

Um dies zu erreichen, können Sie den Selektor :nth-last-child verwenden in CSS3. So funktioniert es:

<code class="css">:nth-last-child(2) {
  /* Styling for the second last child */
}</code>

In diesem Beispiel stimmt der Selektor :nth-last-child(2) mit dem Element überein, das zwei Meter vom Ende seines übergeordneten Elements entfernt ist. Im angegebenen HTML würde es das folgende Element auswählen:

<code class="html"><div>SELECT THIS</div></code>

Hier ist eine aktualisierte Version des HTML mit dem entsprechenden angewendeten Selektor:

<code class="html"><div id="container">
  <div>a</div>
  <div>b</div>
  <div class="second-last">SELECT THIS</div>
  <div>c</div>
</div></code>

<code class="css">#container .second-last {
  /* Styling for the second last child of #container */
  background-color: lightblue;
}</code>

Die unterstützten Browser für :nth-last-child include:

• Chrome 2
• Firefox 3.5
• Opera 9.5 , 10
• Safari 3.1 , 4
• Internet Explorer 9

Das obige ist der detaillierte Inhalt vonWie wähle ich das vorletzte Element in CSS aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!