Selectors - :first-child

  • Supported only by Explorer 5 on Mac, Netscape 6, Opera 7 and Konqueror.
  •  

    How to select an element that is the first child of its parent.

    Testsheet:

    P:first-child {color: #cc0000;}
    

    The :first-child pseudo-class means "if this element is the first child of its parent". In this page the browser should only make the P in the DIV below red, since the other P's are not the first child of BODY (the H2 is).

    A test DIV

    with a paragraph in it

    A test paragraph with a child that shouldn't be red, to be certain no browser interprets it as "the first child of a P".

    Contents