Skip to main content

Getting StartED with CSS

Generated Content Properties

These properties automatically generate content in conjunction with the :before and :after pseudo-elements. They are used mainly to generate sequences of numbers or letters, and quotation marks. See Chapters 8 and 12 for a detailed description of how to use these properties. Not supported by IE6 or IE7.


Accepted values:
The keywords normal or none, or a combination of any of the following: text in quotes, a URL value, a counter value, attr(), open-quote, close-quote, no-open-quote, no-close-quote

Defines the content the browser should insert in the :before and :after pseudo-elements. The keywords normal and none suppress the generation of the pseudo-element. Example

The attr() function extracts the value of an HTML attribute as text. Example

The open-quote, close-quote, no-open-quote, and no-close-quote keywords specify how to display quotation marks defined by the quotes property.

counter-increment, counter-reset

These properties control the numbering of sequences displayed by a counter value defined in the content property. See “Using CSS to generate numbered sequences” in Chapter 8. Example


Defines pairs of quotation marks to be used as opening and closing quotes by the content property. See “Curly quotes, anyone?” in Chapter 12. Currently supported only by IE8, Firefox (since v1.8), and Opera (since v6). Example