この記事は約 2 分で読めます ( 約 1033 文字 )

記事の概要

この記事では箇条書きの書き方について書きます。記事の構成は以下の通りです。

  • 箇条書きでHTMLタグを使う理由
  • 順序なしリストの書き方
  • 順序付きリストの書き方
  • 定義リストの書き方
  • まとめ

箇条書きでHTMLタグを使う理由

箇条書きを書く際は"・"を打った後にその内容を書けばいいかもしれません。しかし、その場合だと行の先頭が噛み合わなかったり、等上手くレイアウトが整わない可能性があります。しかし、htmlタグを使えば自然とレイアウトの整った箇条書きを書くことが出来ます。

順序なしリストの書き方

順序に関係がない箇条書きを書く際は<ul>タグを使います。具体的な使い方は以下の通りです。

ソースコード

<ul>
    <li>あいうえお</li>
    <li>かきくけこ</li>
    <li>さしすせそ</li>
</ul>

実際の表示

  • あいうえお
  • かきくけこ
  • さしすせそ

順序付きリストの書き方

順序つきの箇条書きを書く際は<ol>タグを使います。具体的な使い方は以下の通りです。

ソースコード

<ol>
    <li>あいうえお</li>
    <li>かきくけこ</li>
    <li>さしすせそ</li>
</ol>

実際の表示

  1. あいうえお
  2. かきくけこ
  3. さしすせそ

定義リストの書き方

定義リストとは名前と説明からなるリスト構造です。書く際は<dl>タグを使います。具体的な使い方は以下の通りです。

ソースコード

<dl>
    <dt>あ行</dt>
    <dd>あいうえお</dd>
    <dt>か行</dt>
    <dd>かきくけこ</dd>
    <dt>さ行</dt>
    <dd>さしすせそ</dd>
</dl>

実際の表示

あ行
あいうえお
か行
かきくけこ
さ行
さしすせそ

まとめ

今回は様々なリストの書き方について解説しました。次回は表の書き方について書きます。