:last-child

In this chapter you will learn:

  1. Definition for Selector:last-child
  2. An example showing how to use :last-child CSS selector

Description

The :last-child selector selects the last child element.

Example

<!DOCTYPE HTML> <!--  j  av a2 s  .co m-->
<html> 
    <head> 
        <style type="text/css"> 
        :last-child { 
            border: thin black solid; 
            padding: 4px; 
        } 
        </style> 
    </head> 
    <body> 
        <p>I like <span>HTML</span> and <span>CSS</span>.</p> 
        <a href="http://java2s.com">Visit java2s.com</a> 
    </body> 
</html>

Click to view the demo

The body element is the last child of the html element and is matched by the selector.

Next chapter...

What you will learn in the next chapter:

  1. Definition for Selector:only-child
  2. An example showing how to use :only-child CSS selector
Home » HTML CSS Tutorial » CSS Selector Reference
.class
#id
*
element
element,element
element element
element>element
element+element
element1~element2
:lang
:link
:visited
:active
:hover
:focus
:first-letter
:first-line
:first-child
:last-child
:only-child
:nth-child(n)
:nth-last-child(n)
:before
:after
:first-of-type
:last-of-type
:only-of-type
:nth-of-type(n)
:nth-last-of-type(n)
:root
:empty
:target
:enabled
:disabled
:checked
:not
::selection
[attribute]
[attribute=value]
[attribute~=value]
[attribute|=value]
[attribute^=value]
[attribute$=value]
[attribute*=value]