Jobs Hub

CSS ::after - Add Content after Specified Element

The CSS ::after pseudo-element is used when we need to add some content right after the content of selected element. For example:

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      p::after {content: ".";}
   </style>
</head>
<body>

   <p>This is first para</p>
   <p>This is second para</p>

</body>
</html>
Output

This is first para

This is second para

In above example, after applying the following CSS code:

p::after {content: ".";}

the text inside each and every P element, will be ended with a dot or a full stop (.)

Note - Just like the CSS ::before, we can also add an image after the content of specified element, using CSS ::after, of course.

CSS Online Test

« Previous Tutorial Next Tutorial »