How to add text before or after an element using css

Css allows you to add any text before or after an element. Although this approach should not be applied extensively as this consumes resources on the client side, making site load slow.

In this tutorial we will see how to add text before any element using css or adding it after any element using css with an example.

1. Add this to code to the css part:

h1#example::before,
h1#example::after
{
    content: " - - - ";
}

2. Enter the following changes to the body part of the html document:

<h1 id='example'>Nabeel</h1>

The result will be:

– – – Nabeel – – –

You can use the before and after separately to add different text before and after your element.

hire best wordpress php css developer
Need Help? Hire me now!
I can help you in anything related to webdevelopment, including: HTML, CSS, PHP & MySql, WordPress (plugins & themes development, others), regular expressions, server management, etc.

Leave a Reply

Your email address will not be published.