list-style-image CSS プロパティとは
トピック：リストマーカーのデフォルトコンテンツとして使用されるイメージを指定するために使用する、事ができる このlist-style-imageプロパティを使用すると、リストで使用する独自のカスタム箇条書きを作成できる
プロパティ list-style-image
基本 書式：セレクタ {list-style-image:値;}
実例 コード 1
サンプル コードを試す
<style>
ul {
list-style-image: url(/webref_icon.gif);
}
</style>
<p>次の情報を印刷してください</p>
<ul>
<li>list-style-type</li>
<li>list-style-position</li>
<li>list-style-image</li>
</ul>
プロパティ値
| 値 | 説明 |
|---|
url | リストアイテムマーカーとして使用されるイメージの場所。 |
none | マーカー画像は表示されない代わりに、list-style-typeプロパティはレンダリングされるリストマーカのタイプ（存在する場合）を制御する これはデフォルトです。 |
oblique | ユーザーエージェントのフォントデータベースでobliqueというラベルの付いたフォントを選択する |
inherit | このプロパティをデフォルト値に設定する |
inherit | 親要素からこのプロパティを継承する |
unset | この値は、プロパティが継承されるかどうかに応じて、inheritまたはのいずれかinitialとして機能します。つまり、すべてのプロパティを継承可能な場合は親の値に設定し、継承できない場合は初期値に設定する |
サポートするデスクトップ ブラウザ対応・互換性
| Property | Desktop 互換性 |
|---|
| list-style-image | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|
| 基本 サポート | フルサポート◯1 | フルサポート◯12 | フルサポート◯1 | フルサポート◯4 | フルサポート◯7 | フルサポート◯1 |
|---|
サポートするモバイル ブラウザ対応・互換性
| Property | Mobile 互換性 |
|---|
| list-style-image | Android | Chrome for Android
| Edge Mobile | Firefox for Android
| Opera for Android
| iOS Safari | Samsung Internet |
|---|
| 基本 サポート | フルサポート◯1 | フルサポート◯あり | フルサポート◯12 | フルサポート◯4 | フルサポート◯6 | フルサポート◯1 | フルサポート◯あり |
|---|
CSS list-style-image | CSS プロパティ 値| 意味 使い方 実例 – WebRef