CSS :first-child pseudo-class
 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
The :first-child pseudo-class is supported in all major browsers.
Note: For :first-child to work in IE, a <!DOCTYPE> must be declared.
 |
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
Complete CSS Reference
Whether you're new to XML or already an advanced user,
the user-friendly views and powerful entry helpers,
wizards, and debuggers in XMLSpy are designed to meet your XML
and Web development needs from start to finish.
New features in Version 2010!
- XML editor
- Graphical XML Schema / DTD editors
- XSLT 1.0/2.0 editor, debugger, profiler
- XQuery editor, debugger, profiler
- XBRL validator, taxonomy editor, taxonomy wizard
- Support for Office Open XML (OOXML)
- Graphical WSDL 1.1/2.0 editor & SOAP debugger
- JSON editing & conversion
- Java, C#, C++ code generation
- And much more!
Download a free trial today!
|
|
|
|
