ol ul dl リスト
リスト表示を行う場合に使用します。
リストには、番号なしリスト（ul)番号付きリスト(ol)タイトル付リスト(dl)の3種類があります。
番号有り無しは、どちらの要素を使用してもCSSで表示を変更する事が出来ます。
リストには、番号なしリスト（ul)番号付きリスト(ol)タイトル付リスト(dl)の3種類があります。
番号有り無しは、どちらの要素を使用してもCSSで表示を変更する事が出来ます。
ワードプレスは、リストをエディターのボタン操作や要素の手書き入力を行わないで記号を入力する事でリストを作る事もできますアスタリスクをまず入力します。 スペースを一つ入れると、アスタリスクが消えて、続けて文字を入力すると、自動的にリスト表示が出来ます。
レインドロップスでは、
-
テーマ組み込みクラスがあります
- ul用クラス .rd-list-type-tree
- ol用クラス .sectioned
表示例
ol 番号付きリスト
- ol
- あいうえお
- abc
- ａｂｃ
- abc
- ａｂｃ
<ol> <li>ol</li> <li>あいうえお</li> <li>abc</li> <li>ａｂｃ</li> <li>abc</li> <li>ａｂｃ</li> </ol>
ul 番号なしリスト
- ol
- あいうえお
- abc
- ａｂｃ
- abc
- ａｂｃ
<ul> <li>ol</li> <li>あいうえお</li> <li>abc</li> <li>ａｂｃ</li> <li>abc</li> <li>ａｂｃ</li> </ul>
例 rd-list-type-treeクラス
- ol
- あいうえお
- あいうえお
- abc
- ａｂｃ
- abc
- ａｂｃ
<ul class="rd-list-type-tree"> <li>ol</li> <li>あいうえお<ul><li>あいうえお</li></ul></li> <li>abc</li> <li>ａｂｃ</li> <li>abc</li> <li>ａｂｃ</li> </ul>
例 sectionedクラス
- ol
- あいうえお
- あいうえお
- abc
- ａｂｃ
- abc
- ａｂｃ
<ul class="sectioned"> <li>ol</li> <li>あいうえお<ul><li>あいうえお</li></ul></li> <li>abc</li> <li>ａｂｃ</li> <li>abc</li> <li>ａｂｃ</li> </ul>
dl dt dd データリスト
データリストはブラウザ幅640pxを境界にスタイルが変更されます。
- データリストタイトル1
- データ1
- データ2
- データ3
- データリストタイトル2
- データ1
- データ2
- データ3
- データリストタイトル3
- データ1
- データ2
- データ3
<dl> <dt>データリストタイトル1</dt><dd>データ1</dd><dd>データ2</dd><dd>データ3</dd> <dt>データリストタイトル2</dt><dd>データ1</dd><dd>データ2</dd><dd>データ3</dd> <dt>データリストタイトル3</dt><dd>データ1</dd><dd>データ2</dd><dd>データ3</dd> </dl>