list-style-image

list-style-imageプロパティは、リストマーカの画像を指定するプロパティになります。

list-style-imageの説明図
list-style-image
記法

.クラス名 {
 list-style-image : url(画像url.拡張子);
}

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./main.css" />
    <title>list-style-imageプロパティ</title>
  </head>

  <body>
    <ul class="list-style">
      <li>リスト1</li>
      <li>リスト2</li>
      <li>リスト3</li>
    </ul>
  </body>
</html>
.list-style {
  list-style: url(画像url);
}
出力結果
  • リスト1
  • リスト2
  • リスト3