--- title: ':last-child' slug: 'Web/CSS/:last-child' tags: - CSS - Layout - Pseudo-class - Reference - Web translation_of: 'Web/CSS/:last-child' ---
{{CSSRef}}

La pseudo-class CSS :last-child representa l'últim element entre un grup d'elements germans.

/* Selecciona qualsevol <p> que sigui l'últim element entre els seus germans */
p:last-child {
  color: lime;
}

Nota: Com es va definir originalment, l'element seleccionat havia de tenir un pare. A partir dels selectors de nivell 4, això ja no és necessari.

Sintaxi

{{csssyntax}}

Exemple

Exemple bàsic

HTML

<div>
  <p>This text isn't selected.</p>
  <p>This text is selected!</p>
</div>

<div>
  <p>This text isn't selected.</p>
  <h2>This text isn't selected: it's not a `p`.</h2>
</div>

CSS

p:last-child {
  color: lime;
  background-color: black;
  padding: 5px;
}

Resultat

{{EmbedLiveSample('Basic_example', 500, 200)}}

Disseny d'una llista

HTML

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3
    <ul>
      <li>Item 3.1</li>
      <li>Item 3.2</li>
      <li>Item 3.3</li>
    </ul>
  </li>
</ul>

CSS

ul li {
  color: blue;
}

ul li:last-child {
  border: 1px solid red;
  color: red;
}

Resultat

{{EmbedLiveSample('Styling_a_list')}}

Especificacions

Especificació Estat Comentari
{{SpecName('CSS4 Selectors', '#last-child', ':last-child')}} {{Spec2('CSS4 Selectors')}} No es requereix que els elements coincidents tinguin un pare.
{{SpecName('CSS3 Selectors', '#last-child', ':last-child')}} {{Spec2('CSS3 Selectors')}} Definició inicial

{{CompatibilityTable}}

Descripció Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Suport bàsic 1.0 {{CompatVersionUnknown}} {{CompatGeckoDesktop("1")}} 9.0 {{CompatOpera(9.5)}} 3.2
No es requereix pare {{CompatChrome(57)}} {{CompatUnknown}} {{CompatGeckoDesktop("51")}}[1] {{CompatUnknown}} {{CompatOpera(44)}} {{CompatUnknown}}
Descripció Android Webview Chrome for Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport bàsic {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatGeckoMobile("1")}} 9.0 {{CompatOperaMobile(10)}} 3.2
No es requereix pare {{CompatChrome(57)}} {{CompatChrome(57)}} {{CompatUnknown}} {{CompatGeckoMobile("51")}}[1] {{CompatUnknown}} {{CompatOperaMobile(44)}} {{CompatUnknown}}

 

[1] Veure {{bug(1300374)}}.

Vegeu també