English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS Reference Manual

CSS @rules

Complete List of CSS Attributes

CSS :after Selector

Complete CSS Selector Reference Manual

Online Example

Content inserted after each <p> element:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>Basic Tutorial(oldtoolbag.com)</title>　
<style>
p:after
{　
content:"-　mark me";
}
</style>
</head>
<body>
<p>My name is Lili</p>
<p>I live by the </p>
<p><b>Notice:</b> :after in IE8It must be declared !DOCTYPE </p>
</body>
</html>
Test to see ‹/›

Definition and Description

:after Selector to insert content after the selected element.

Usecontent attribute to specify the content to be inserted.

Browser Compatibility

The numbers in the table indicate the first browser version that supports the attribute.

Selector




::after4.09.0
Parts from 8.0		3.53.17.0
Parts from4.0

Notice: after in IE8It must be declared<!DOCTYPE> .

Related Articles

CSS Tutorial: CSS Pseudo-elements

CSS Selector Reference Manual: CSS :before Selector

Online Example

The content and style inserted after each <p> are:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>Basic Tutorial(oldtoolbag.com)</title>　
<style>
p:after
{　
　　　　content:"-　mark";
　　　　background-color:yellow;
　　　　color:red;
　　　　font-weight:bold;
}
</style>
</head>
<body>
<p>My name is Lili</p>
<p>I live by the </p>
<p><b>Notice:</b> :after in IE8It must be declared !DOCTYPE </p>
</body>
</html>
Test to see ‹/›
CSS Functions (Functions)Comprehensive Manual of CSS Selectors