WEBでリストを作りたいときは<li>要素を使います。箇条書きにしたいテキストをそれぞれ<li>要素で囲むことでリストを作ることができます。

開始タグ→<li>    終了タグ→ </li>

<li>要素は囲む要素によって種類が変わるという特徴で<ul>要素で囲むと黒点が先頭につきます。このように要素を要素で囲むことを入れ子といい、囲む法の要素を親要素、囲まれる側を子要素といいます。

例えば、

・あか

・あお と表示させたい場合は、

<ul>

   <li>あか</li>

   <li>あお</li>

</ul>

  • あか
  • あお

このように打ち込めば箇条書きで表示されます。最初を黒点ではなく数字にしたい場合は、ol要素を使います。(Ordered Listの略)

<ol>

  <li>ウインナーと玉ねぎを小さめに切り、フライパンにバターを入れて、玉ねぎがしんなりするまで炒める。</li>

 <li>1の具にケチャップ・塩こしょうを入れて混ぜ合わせ、一度火を止める。</li>

</ol>

このように打つと、

  1. ウインナーと玉ねぎを小さめに切り、フライパンにバターを入れて、玉ねぎがしんなりするまで炒める。
  2. 1の具にケチャップ・塩こしょうを入れて混ぜ合わせ、一度火を止める。

と表示されます。

 

基本的にWEBでリストを作りたいときは<li>をもとに自分の表示させたい形式で囲むとリストができるということです。状況に合わせてうまくHTMLタグを使いましょう。