w3schools
Search W3Schools :  
  
HOME HTML CSS XML JAVASCRIPT ASP PHP SQL MORE...   References Examples Forum About

CSS :first-child pseudo-class

CSS Reference Complete CSS Reference

Example

In the example below, the selector matches any p element that is the first child of another element (here, the first p element is the first child of the body element):

<html>
<head>
<style type="text/css">
p:first-child {color:blue}
</style>
</head>

<body>
<p>This is some text.</p>
<p>This is some text.</p>
</body>
</html>

Try it yourself »

More examples at the bottom of this page.

Definition and Usage

The :first-child pseudo-class adds a style to an element that is the first child of another element.


Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The :first-child pseudo-class is supported in all major browsers.

Note: For :first-child to work in IE, a <!DOCTYPE> must be declared.


Examples

Try it Yourself - Examples

Match the first i element in p elements
In this example, the selector matches the first i element in every p element.

Match all i elements in all first child p elements
In this example, the selector matches all i elements in p elements that are the first child of another element.

Match the first list item in lists
In this example, the selector matches the first li element in lists.

Match the first child of all list items
In this example, the selector matches the first child of all li elements.


Related Pages

CSS tutorial: CSS Pseudo classes


CSS Reference Complete CSS Reference

Altova® MissionKit® - Integrated Suite of XML tools

Altova MissionKit

The Altova MissionKit, recent winner of the Jolt Product Excellence and Productivity Award for Best Development Environment, is an integrated suite of tools ideal for:

  • XML development
  • Web & Web services development
  • Data mapping & integration
  • Rendering & publishing XML & database data
  • XBRL validation, taxonomy editing, transformation & rendering

The MissionKit for XML Developers includes XMLSpy®, MapForce®, and StyleVision® plus 3 additional tools for less than the price of 2.

Try all 6 products free for 30 days!

Download a fully-functional free trial

  Altova Missionkit


WEB HOSTING
Best Web Hosting
PHP MySQL Hosting
Top 10 Web Hosting
UK Reseller Hosting
Web Hosting
FREE Web Hosting
Top Web Hosting
Windows Hosting
WEB BUILDING
Download XML editor
FREE Flash Website
FREE Web Templates
Website Monetization
FLIGHT TICKETS
Find the cheapest flight
to any destination now!
EDUCATION
US Web Design Schools
HTML Certification
JavaScript Certification
XML Certification
PHP Certification
ASP Certification
STATISTICS
Browser Statistics
Browser OS
Browser Display
W3Schools.com HOME | TOP | PRINT | FORUM | ABOUT
W3Schools is for training only. We do not warrant the correctness of its content. The risk from using it lies entirely with the user.
While using this site, you agree to have read and accepted our terms of use and privacy policy.
Copyright 1999-2009 by Refsnes Data. All Rights Reserved.