項目を順不同で羅列するときなどに便利なリストタグ。
概要
- <ul>～</ul>
-
ul は、unordered list の略。
-
順不同リストの大枠。
-
<li>～</li>を入れる。
-
type属性でリストマークを指定。（HTML 5 において、廃止。）
- <li>～</li>
-
li は、list items の略。
-
項目を記述。
-
type属性でリストマークを指定。（HTML 5 において、廃止。）
HTML4.01 と HTML 5の違い
HTML4.01 では、ul 要素の type 属性が使えたが、HTML 5 において、廃止された。HTML 5 では、リストマークの指定には、スタイルシートの list-style-type を使う必要がある。
順不同リストの例
順不同リストの基本例
HTMLソースコード
1 2 3 4 | <ul> <li>項目</li> <li>項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
順不同リストのマークを指定する例
disc
HTMLソースコード
1 2 3 4 | <ul type="disc"> <li>項目</li> <li>項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
circle
HTMLソースコード
1 2 3 4 | <ul type="circle"> <li>項目</li> <li>項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
square
HTMLソースコード
1 2 3 4 | <ul type="square"> <li>項目</li> <li>項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
項目（<li>～</li>）ごとにリストマークを指定する例
HTMLソースコード
1 2 3 4 5 | <ul> <li type="disc">項目</li> <li type="circle">項目</li> <li type="square">項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
- 項目
順不同リストの入れ子の例
HTMLソースコード
1 2 3 4 5 6 7 8 | <ul> <li>項目 <ul> <li>項目</li> </ul> </li> <li>項目</li> </ul> |
↓↓↓ ブラウザでの表示例 ↓↓↓
- 項目
- 項目
- 項目