[CSS] リストマーカーに画像を指定する

2019年4月17日

リストマーカーに画像を指定するには、「list-style-image」を使用します。

構文

list-style-imageの構文です。

list-style-image:＜値＞

【list-style-imageの値】

値	意味
none	マーカーに画像を使用しない（デフォルト）
url('画像のパス')	マーカーに指定した画像を使用する

リストマーカーに画像「」(image/niwatori.png)を指定する

ul.sample{
  list-style-image:url('image/niwatori.png');
}

ul.sample{

list-style-image:url('image/niwatori.png');

}

<ul class="sample">
  <li>いぬ</li>
  <li>ねこ</li>
  <li>うさぎ</li>
</ul>

</ul>

【結果】

※にわとりさんはこちらのページから頂きました m(_ _)m 　→

Posted by tora