擬似要素は疑似クラスと比較してあまり頻繁には使用しませんが、使いこなすと便利なのでメモっておきます。

::before

要素の前

::after

要素の後

::first-line

ブロック要素の最初の行

::first-letter

ブロック要素の最後の行

以下、疑似要素の主な使い道。

clearfix

.clearfix::after {
content: "";
clear: both;
display: block;
}

マーカーやアイコン

マーカーは::afterで見出しなどを指定する。
アイコンはPURE CSS GUI ICONSとかをなんかする。

ダミーテキスト

<style rel="stylesheet" type="text/css">
.dummy_text:before {
content:"これはダミーです。";
}
</style>
<p class="dummy_text"> </p>