CSS2 » Other » first-child

Version: Level 1

Compability: Currently not supported by any browser.

Syntax:
first-child

The first-child pseudo-class is used to apply style to the first element, called the first-child element, that is contained inside a specific parent element.

A pseudo-class is assigned to a selector via following syntax:
 
selector:pseudo-class { property: value; ...; }
 
A pseudo-class can also be used with the value assigned as a class to a selector:
 
selector.class:pseudo-class { property: value; ...; }
 

Examples

Code:
<html>
<head>
<title>first-child test</title>
<style type="text/css">
p:first-child {color: orange;}
</style>
</head>
<body>
<p>
I love <b>DevGuru</b> more than I love <i>ice cream</i>!
</p>
</body>
</html>
Output:
I love DevGuru more than I love ice cream!
Explanation:

In this example, the first-child element are the pair of opening and closing bold tags that enclose DevGuru. This is simulated output.

Language(s): CSS2

See Also: