valdevweb
11/24/2017 - 10:45 PM

:BEFORE and :AFTER

This CSS is a selector that allows you to choose a CSS element and insert content before every element with a specific class applied to it. Let’s say you had a website where you wanted specific text before every H2 tag. You would us this setup:

Like the :before selector, you can use :after to insert content globally on specific elements. A practical use would be adding “read more” after every excerpt on a blog. Here’s how you would do that.

.css
content_copyfile_download
h2:before { 
    content: "Read: ";
<span class="Apple-converted-space">    color: #F00;</span>
}


p:after{ 
    content: " -Read more… ";
    color:#f00;
}