:before and :after usage

:before and :after are used to add the content you specify before and after the content of the element

HTML code

<p>before和after中的代码</p>

CSS code

p:before{
    content:'before的作用';
    color:blue;
}
p:after{
    content:'after的作用';
    color:green;
}

Show results

         The role of before before and after the role of the code between after