Copyright © tutorialspoint.com

CSS - content

previous next


Advertisements

Description:

The content property defines content to be inserted in generated content operations. This property is used alongwith :before or :after pseudo elements.

Possible Values:

Applies to:

:before and :after pseudo-elements.

DOM Syntax:

object.style.content="url(home.avi)"

Example:

Following is the example which demonstrates how to use :before element to add some content before any element .

<style type="text/css">
p:before
{
content: url(/images/bullet.gif)
}
</style>
<p> This line will be preceded by a bullet.</p>

<p> This line will be preceded by a bullet.</p>

<p> This line will be preceded by a bullet.</p>

This will produce following black link:

This line will be preceded by a bullet.

This line will be preceded by a bullet.

This line will be preceded by a bullet.

To Become more comfortable - Do Online Practice

Following is the example which demonstrates how to use :after element to add some content after any element .

<style type="text/css">
p:after
{
content: url(/images/bullet.gif)
}
</style>
<p> This line will be succeeded by a bullet.</p>
<p> This line will be succeeded by a bullet.</p>
<p> This line will be succeeded by a bullet.</p>

This will produce following black link:

This line will be succeeded by a bullet.

This line will be succeeded by a bullet.

This line will be succeeded by a bullet.

To Become more comfortable - Do Online Practice


previous next

Copyright © tutorialspoint.com