generates content before or after an element

content: ***;

Firefox Opera

The content property generates content before or after an element.

This property is used with the "before" and "after" pseudo-elements.

p:before {
content: url(icon.gif);

p:after {
content: "Text";

Property Value Explanation
content string, URL, and other values generated content

The "before" and "after" pseudo-elements

before : Generates content before an element.
after : Generates content after an element.

When you specify the text
content: "Example";

When you specify the image etc
content: url(example.gif);
content: url(example.wav);


<title>TAG index</title>

<style type="text/css">

p:before {
content: url(image/icon.gif);

p:after {
content: "[Not supported by MSIE]";
color: red;



<p>This is example text.</p>


This is example text.