擬似クラス"before""after"

文章の先頭、見出し部分にiconとして画像を表示したい！という場合に利用出来る。
指定した要素の「前”before”」か「後”after”」に画像を挿入することが出来る。
画像の位置をテキストを合わせる為に、positionを指定する。

wpの場合

ul li:before{
content: url(ファイルの URL);
margin: 5px;
position: relative;
top:3px;
}

/*max-width: 480px*/の場合
.ul li aにdisplay: bloc;だとずれるので、float:left;指定する。

ul li{
border-bottom: 1px solid #888;
overflow:hidden;
}

ul li a{
padding:20px 0;
text-decoration: none;
display: block;
float:left;
width:90%;
}

ul li:before{
float:left;
top:16px;
margin: 6px;
}