last-child property

Author admin Reading 1 min Views 687 Published by May 23, 2012 Modified by October 23, 2024

Contents

Definition and Usage

The :last-child CSS pseudo-class represents any element that is the last child element of its parent.

element:last-child { style properties }

li:last-child { 
  
    background-color: lime; 
  
}

<ul> 
  
  <li>This item is not limed.</li> 
  
  <li>This item is! :)</li> 
  
</ul>

Result

<ul> 
  
    <li>List 1</li> 
  
    <li>List 2</li> 
  
    <li>List 3</li> 
  
</ul>

ul li{ 
  
    color:red; 
  
} 
  
ul li:last-child{ 
  
    color:green; 
  
}

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	1.0	1.0 (1.7 or earlier)	9.0	9.5	3.2

Feature	Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	2.1	1.0 (1)	9.0	10.0	3.2