第2回 (2022/10/26)

参考書：P50 ~ P55

今回の学習内容

箇条書き（リスト）

ul

Unordered Listの略で、数的な順序がなく、その配置順に意味を持たない項目を持つリストを表す。

【参考資料】 developer.mozilla.org

<< 使用例 >>

<ul>
    <li>最初のリスト項目</li>
    <li>二番目のリスト項目</li>
    <li>三番目のリスト項目</li>
</ul>

<< 表示 >>

・最初のリスト項目

・二番目のリスト項目

・三番目のリスト項目

ol

Ordered Listの略で、順序のあるリストを表示する際に使用する。

【参考資料】 developer.mozilla.org

<< 使用例 >>

<ol>
    <li>最初のリスト項目</li>
    <li>二番目のリスト項目</li>
    <li>三番目のリスト項目</li>
</ol>

<< 表示 >>

1.最初のリスト項目

2.二番目のリスト項目

3.三番目のリスト項目

li

List Itemの略で、リストの項目を表す。

<ol>、<ul>、<menu>のいずれかの子要素として配置する必要がある。

<< 応用 >>

<ul>
  <li>first item</li>
  <li>second item
  <!-- ここには <li> の閉じタグはない -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
  <!-- ここに </li> を記述し、要素を閉じている -->
  </li>
  <li>third item</li>
</ul>

説明リスト

dl

description listの略で、説明リストを表す。

【参考資料】 developer.mozilla.org

dt

説明または定義リストの中で用語を表す部分であり、

の子要素としてのみ用いることができる。

【参考資料】

developer.mozilla.org

dd

Definition Descriptionの略で、定義の説明を意味する。

【参考資料】

developer.mozilla.org

<< 使用例 >>

<dl>
    <dt>名前</dt>
    <dd>かぴぞう</dd>
    <dt>年齢</dt>
    <dd>3歳</dd>
</dl>

＊簡単に説明すると、「dt」は情報のタイトル（名前、趣味、メールなど）で、「dd」は「dt」の説明文になる。