テンプレートとアクセスアップのでめらら楽天日記

3-9リスト(定義付け)

リストタグを使ってテキストを整理しよう！（3）

■<dl>定義型リスト（Definition List）定義型のリストを作るタグです。dlタグに囲まれた部分で、dtタグとddタグを組み合わせて指定します
□compact---短いことばと説明を一行のなかで表示させる場合に使用

【基本的な記述方法】
<dl>
<dt>定義づけしたいことば（1）</dt>
<dd>定義づけしたい内容の説明（1）</dd>
<dt>定義づけしたいことば（2）</dt>
<dd>定義づけしたい内容の説明（2）</dd>
<dt>定義づけしたいことば（3）</dt>
<dd>定義づけしたい内容の説明（3）</dd>
</dl>

【省略記述方法】<dt><dd>の閉じタグ</dt></dd>は省略できます（^^）
<dl>
<dt>定義づけしたいことば（1）
<dd>定義づけしたい内容の説明（1）
<dt>定義づけしたいことば（2）
<dd>定義づけしたい内容の説明（2）
<dt>定義づけしたいことば（3）
<dd>定義づけしたい内容の説明（3）
</dl>

<dl>
<dt> Google </dt>
<dd> ページの人気度を反映したランキングを行なうサーチエンジンの日本語版。 </dd>
<dt> Yahoo! </dt>
<dd> 掲示板、オークションなどの参加型コンテンツがあるディレクトリ。 </dd>
<dt> MSN </dt>
<dd> マイクロソフトネットワークによる検索サービス。Looksmartのディレクトリを使用。 </dd>
</dl>

↓こんな感じですね（＾＾）

Google: ページの人気度を反映したランキングを行なうサーチエンジンの日本語版。
Yahoo!: 掲示板、オークションなどの参加型コンテンツがあるディレクトリ。
MSN: マイクロソフトネットワークによる検索サービス。Looksmartのディレクトリを使用。

【短文型一行記述方法】
<dl compact>
<dt>定義づけしたいことば（1）</dt>
<dd>定義づけしたい内容の説明（1）</dd>
<dt>定義づけしたいことば（2）</dt>
<dd>定義づけしたい内容の説明（2）</dd>
<dt>定義づけしたいことば（3）</dt>
<dd>定義づけしたい内容の説明（3）</dd>
</dl>

<dl compact>
<dt> Google</dt>
<dd> ランキングを行なうサーチエンジン </dd>
<dt> Yahoo! </dt>
<dd> 参加型コンテンツがあるディレクトリ </dd>
<dt> MSN</dt >
<dd> マイクロソフトによる検索サービス </dd>
</dl>

↓こんな感じですね（＾＾）

Google: ランキングを行なうサーチエンジン
Yahoo!: 参加型コンテンツがあるディレクトリ
MSN: マイクロソフトによる検索サービス

リストタグはほかにも以下のものがありますが、今後の使用はしないほうが無難だと思います。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

<listing> ～ </listing>
listing タグで囲まれたテキストはリスト扱いで、改行やスペースが無視されないで、記述したまま小さな字体で表示される。
一行の文字数を132に指定して、<pre>タグとほぼ同様にそのまま表示するタグですがhtml4.0で廃止予定です。

<xmp> ～ </xmp>
listing タグ同様<pre>タグとほぼ同様です。html4.0で廃止予定です。

*****************************************************
なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ