CSS: Insert Content ::Before, ::After

The ::before CSS Pseudo Element let you insert content into a HTML element .

Similarly for ::after .

For example, a typical use is for Question and Answers:

How to do this?

The “Q” is not in HTML. It is added by CSS.

Here is the HTML code:

<p class="q15492">How to do this?</p>

Here is the CSS code:

p.q15492:before {
content:"Q ";
font-size:40px;
}