:使用前と:使用後

:before と :after は、要素のコンテンツの前後に指定したコンテンツを追加するために使用されます。

HTMLコード

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

CSSコード

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

結果を示す

         前後のコードの役割前後の間のコードの役割