The CSS content property
The following example adds a URL to the parenthesis after each link:
a:after
{
content: " (" attr(href) ")";
}
{
content: " (" attr(href) ")";
}
Try it out . . .
Description of property definition and use
The ontent property is used in conjunction with the :before and :after pseudo-elements to insert the generated content.
| Default: | normal |
|---|---|
| Inherited: | no |
| Version: | CSS2 |
| JavaScript syntax: | object .style.content="url(beep.wav)" |
Browser support
All major browsers support the Content property.
Note: I E8 is only specified! DOCTYPE only supports TheContent property.
Content property value
| Value | Description |
|---|---|
| none | Set UpContent, if specified as Notting |
| normal | Set thecontent, if specified, normal, the default is "none" (this is noting) |
| counter | Set the counter content |
| attr (attribute) | SetContent as one of the selector's properties. |
| string | SetContent to the text you specify |
| open-quote | Setting UpContent is an open quote |
| close-quote | SettingContent is a closed quote |
| no-open-quote | If specified, remove the start quote for the content |
| no-close-quote | If specified, remove the closed quotation marks for the content |
| url( url ) | Set up some kind of media (images, sounds, videos, etc.) |
| inherit | The value of the specifiedcontent property should be inherited from the parent element |
Related articles
CSS Reference Manual: :before Pseudo-Elements
CSS Reference Manual: :After Pseudo-Elements