contentNN 6 IE n/a CSS 2

Inherited: No

Defines the actual content or source of content to be displayed before and/or after the current element. In CSS jargon, this kind of content is called generated content. This attribute may be set only with the :before and :after pseudo-elements associated with a real element. For example, as a result of the following style sheet rule:

a permissions phrase is appended to the end of every blockquote element, although the content does not become a member of the document tree. HTML tags in the content text are not interpreted, but if the situation warrants it, an external document can be assigned to the content attribute.

 
CSS Syntax
 
content: string | uri | counter | attr(attrName) | open-quote | close-quote |
no-open-quote | no-close-quote
 
Value

Only the following value types or values are functional in Netcape 6: string, open-quote, close-quote, no-open-quote, and no-close-quote. The purpose of the "no" quote types is to let you specify the effect of a quote (as far as quote nesting goes) without displaying a quote symbol. Multiple space-delimited strings may follow the content: attribute name.

Another value (counter) is not yet supported by browsers, but its potential is significant for documents that would benefit from client-side section number generation. A CSS counter offers a way for a style sheet to control numbering schemes for sequences of elements (such as sections, illustrations, and the like). The assumption is that the numbering is not part of the actual content, but is determined solely by the rendered context of the element within the document. Therefore, if you remove a numbered paragraph from a document in the edit phase, the paragraph numbering of the document adjusts itself automatically when the page is rendered.

The basic operation of a counter entails assigning an identifier to it (thus allowing multiple counters to exist in the same document, such as one for sections, another for subsections). Other CSS attributes (counter-increment and counter-reset) require values that point to an identified counter to control the numbering sequence. The following style sheet rule inserts a section label and number in front of every h1 element, and increments the counter number each time the style is applied to an h1 element while the document renders:

When counters are implemented in mainstream browsers, they will provide substantial power to highly structured, long documents.

h1:before {counter-increment:secNum;
           content:"Section " counter(secNum) ". "}
 
Initial Value

"" (empty string)

 
Example
 
p.note:before {content:"==>"}
 
Applies To

All elements plus a :before and/or :after pseudo-element.