番号のないリスト <UL>

番号のないリストとは、以下のようなものです。

• HONDA BEAT
• Alfa Romeo 147
• Lotus Elise

このように、箇条書きにする場合に使います。これをHTMLで表現すると、

<UL>
    <LI>HONDA BEAT
    <LI>Alfa 147
    <LI>Lotus Elise
</UL>

となります。全体をUnordered Listsを意味する<UL>で囲み、その中に項目(List Item)を<LI>で書きます。<LI>は、終了タグを省略可能です。これをツリー図で表わすと、

です。

また、ネストさせることも可能です。ネストとは、

• HONDA
  • BEAT
  • NSX
• Alfa Romeo
  • Alfa 147
  • Alfa Sportwagon
  • Alfa Spider

のように、リストの中のリストのような入れ子になっているもののことをいいます。これをHTMLで表現すると、

<UL>
    <LI>HONDA
    <UL>
        <LI>BEAT
        <LI>NSX
    </UL>
    </LI>
    <LI>Alfa Romeo
    <UL>
        <LI>Alfa 147
        <LI>Alfa Sportwagon
        <LI>Alfa Spider
    </UL>
    </LI>
</UL>

となります。つまり、最初の<UL>の中には<LI>が含まれ、その中にさらに<UL>が含まれているのです。先ほど、<LI>は終了タグを省略可能だと書きましたが、ネストさせた時は</LI>も書いておく方が無難です。これをツリー図で表わすと、

ですね。HTMLで文書を作るときには、お互いのタグが親子または兄弟関係になれるのかどうかに注意することは、とても重要なことです。特に、リスト表示のところはややこしいです。でも、これを押さえておけば、HTMLで簡単に正しい文章を書けるようになります。

それでは、次に番号の付いたリストを書いてみましょう。