リストの使い分けをマスターしよう

このレッスンでは、HTMLでli、ul、ol、dlの4種類のタグを使ったリストの作り方を学びます。
リストを使う事で複数の情報を整理し、一覧で分かりやすく表示することができます。

liタグとは？

liタグはHTMLでリストを作るために使われるタグの一つです。
リストの項目はliタグで挟みます。ulやolタグの中に置かれ、それぞれのタグと合わせて使うことでリストが完成します。

<ul>
  <li>リストの項目</li>
  <li>リストの項目</li>
  <li>リストの項目</li>
</ul>

ulタグとは？

ulタグは、Unordered List（アンオーダードリスト）の略です。順番に関係のない箇条書きで表現する時に使います。

liをulで挟んだ場合、各項目の左に黒丸がつきます。

また、liの中にulタグを入れて、リストの中にリストを作ることもできます。

olタグとは？

olタグは、Ordered List（オーダードリスト）の略です。順番がある番号つき箇条書きを表現する時に使います。
1.2.3...と数字がつけられるリストです。

liをolで挟んだ場合は、各項目の左に1、2、3...と数字がつきます。この数字はliが増えていけばその数だけ番号も増えていきます。

Orderedとは「順序づけられた」という意味。”Un”orderedと(順序づけられていない)と合わせて覚えると使い分けしやすいね！

dlタグとは？

dlタグは、説明リストと呼ばれ、新しい言葉や用語を説明する時に使います。

liタグではなく、新たにdt、ddタグを使います。

• dl...説明リスト
• dt...説明する言葉
• dd...説明文

dtの内容をddで説明しているような形になっていればOK！