サイト内検索

...スタイルシート(css)...

スタイルシート・リスト

リストマークとテキストの間隔

リストマークとテキストの間隔は、paddingプロパティを指定します。
li 要素に設定すると、リストマークとテキストの間隔の指定ができます。
[使い方]
.sample li{
padding-left: 15px;
}
プロパティ名 説明
padding:; 「数値+単位」(例・・100px)を指定します。
単位は、「px」または「%」を指定します。
auto(自動)

[個別の設定方法]
プロパティ名
(サンプル)
説明
padding-left:40px;左の余白の指定をします。

サンプル

[headの中]

<style type="text/css">
<!--
.sample1 li{
padding-left: 15px;
}
-->
</style>

[bodyの中]

<ul>
<li>カサブランカ・ユリ科</li>
<li>モダンローズ・バラ科</li>
<li>胡蝶蘭・ラン科</li>
</ul>
<ul class="sample1">
<li>カサブランカ・ユリ科</li>
<li>モダンローズ・バラ科</li>
<li>胡蝶蘭・ラン科</li>
</ul>

[ブラウザ上]

  • カサブランカ・ユリ科
  • モダンローズ・バラ科
  • 胡蝶蘭・ラン科
  • カサブランカ・ユリ科
  • モダンローズ・バラ科
  • 胡蝶蘭・ラン科

Copyright c 2007.10.01 luc All rights reserved.