サイト内検索
...スタイルシート(css)...
スタイルシート・リスト
マークを画像で
- マークの位置は、list-style-imageプロパティを指定します。
- ul 要素・ol 要素・li 要素・display(list-item を指定)要素で適用されます。
- [使い方]
- ul{
list-style-image: url(img/sample.jpg);
}
- 外部ファイルで画像を表示させる場合
- 画像の外部スタイルシートファイル(.css)から見た
- 画像ファイルの相対アドレス(url)を記述します。
プロパティ名 | 値 | 説明 |
---|---|---|
list-style-image: | ; |
「url(http://・・/sample.jpg);」
のように表示する画像(URL)を指定します。 |
none | 画像なし(標準値) |
サンプル
[headの中]
<style type="text/css"><!--
ul{ list-style-image: url(img/smple);
}
-->
</style>
[bodyの中]
<ul><li>カサブランカ・ユリ科</li>
<li>モダンローズ・バラ科</li>
<li>胡蝶蘭・ラン科</li>
</ul>
[ブラウザ上]
- カサブランカ・ユリ科
- モダンローズ・バラ科
- 胡蝶蘭・ラン科