CSS ::before Selector
Example
Insert some text before the content of each <p> element:
p::before
{
content: "Read this: ";
}
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The ::before selector inserts something before the content of each selected element(s).
Use the content property to specify the content to insert.
Use the ::after selector to insert something after the content.
| Version: | CSS2 |
|---|
Browser Support
The numbers in the table specifies the first browser version that fully supports the selector.
| Selector | |||||
|---|---|---|---|---|---|
| ::before | 4.0 | 9.0 | 3.5 | 3.1 | 7.0 |
CSS Syntax
::before {
css declarations;
}
More Examples
Example
Insert content before every <p> element's content, and style the inserted content:
p::before
{
content: "Read this -";
background-color: yellow;
color: red;
font-weight: bold;
}
Try it Yourself »
Related Pages
CSS tutorial: CSS Pseudo-elements
CSS Selector Reference: CSS ::after selector
Copyright 1999-2023 by Refsnes Data. All Rights Reserved.