CSSデザインリスト
- 定義リストに見出し画像を指定する〔背景プロパティ(background)使用〕
定義リストに見出し画像を指定する
背景プロパティ(background)使用
unknown
<style type="text/css"> #dlist { margin:10px 0; padding:0; } #dlist dt { margin:5px 0 0 10px; padding:0 0 0 16px; /* 背景画像があるため、左余白をあける */ background-image:url(/content/img/icon/gray/diamonds_2.gif); /* 背景画像を指定 */ background-position:left center; /* 背景画像は「左中央」に表示 */ background-repeat:no-repeat; /* 背景画像を繰り返して表示しない */ } #dlist dd { margin:0 0 0 20px; /* インデント */ padding:0 0 0 16px; /* 背景画像があるため、左余白をあける */ background-image:url(/content/img/icon/gray/diamonds_1.gif); /* 背景画像を指定 */ background-position:left center; /* 背景画像は「左中央」に表示 */ background-repeat:no-repeat; /* 背景画像を繰り返して表示しない */ } </style> <div id="dlist"> <dl> <dt>りんご</dt> <dd>果皮の色は赤もあれば青もあります。</dd> <dd>芯に近い部分の蜜が甘いです。</dd> <dt>みかん</dt> <dd>ビタミンが豊富に含まれています。</dd> <dd>食べ過ぎると手が黄色くなります。</dd> <dt>メロン</dt> <dd>高級フルーツです。</dd> </dl> </div>
- りんご
- 果皮の色は赤もあれば青もあります。
- 芯に近い部分の蜜が甘いです。
- みかん
- ビタミンが豊富に含まれています。
- 食べ過ぎると手が黄色くなります。
- メロン
- 高級フルーツです。