ショコラ
CSS liタグにアイコンを付けるには?
liタグにアイコンを付けるポイントです。
①ulタグ は list-style:none でアイコンを消す。padding-left を消す。
②liタグは position:relative に設定する。アイコン分の padding-left を入れる。
③imgタグのアイコンは position:absolute に設定する。アイコンの位置を調整する。
もっさん先輩
<html>
<body>
<ul style="list-style:none; padding-left:0;">
<li style="position:relative; padding-left:25px; font-weight:bold;">
<img src="icon.svg" style="position:absolute; top:1px; left:2px; width:20px; height:20px; ">
ラベル
</li>
<li style="position:relative; padding-left:25px; font-weight:bold;">
<img src="icon.svg" style="position:absolute; top:1px; left:2px; width:20px; height:20px; ">
ラベル
</li>
</ul>
</body>
</html>
以上