CSS擬似要素after AND before

:after擬似要素は、要素の後にコンテンツを追加します.:before擬似要素は、要素の前にコンテンツを追加します.デフォルトでは、この擬似要素は行内要素ですが、属性displayを使用して変更できます.

<!-- index.html body       -->



<p>web</p>

/*  CSS  */



p:after{

    content: "]";   /* web     ] ,       */

}



p:before{

    content: "[";   /* web     [ ,       */

}



p:after{

    content: url(image.png);   /* web      */

}



p:before{

    content: url(image.png);   /* web      */

}

content:url()のカッコにオーディオファイルを付けることもできるそうですが、試してみたら成功せず、私が書いたコードに問題があるのか分かりません.
すべての主流ブラウザでは、before擬似要素がサポートされています.