箇条書き

箇条書きのタグ

文字を箇条書きで表示させるためのタグが3種類あります。

  • 通し番号をつけるタグ<ol>
  • 番号なし、頭に記号をつけるタグ<ul>
  • キーワード定義用タグ<dl>

通し番号をつけるタグ<ol>と番号なしの箇条書きタグ<ul>

<ol>と</ol>で挟んだ範囲が通し番号付きの箇条書きになることを定義します。
<ul>と</ul>で,その範囲が通し番号なしの箇条書になることを定義します。
箇条書き範囲には、項目をリストするタグは<li>です。このタグを先頭につけて項目を書いていきます。

簡単な例

HTML 画面表示
<ol>
<li>りんご
<li>なし
<li>いちご
</ol>
  1. リんご
  2. なし
  3. いちご
<ul>
<li>りんご
<li>なし
<li>いちご
</ul>
  • リんご
  • なし
  • いちご

<ol>タグのオプション

<ol>タグの一般パターン:<ol type=A/a/1/I/i start=最初番号の数値>

  • type=Aと指定すると、通し番号はアルファベット大文字(A,B,C,D…)になります。
  • type=aと指定すると、通し番号はアルファベット小文字(a,b,c,d…)になります。
  • type=1と指定すると、通し番号は数字(1,2,3,4…)になります。
  • type=Iと指定すると、通し番号は大文字ギリシャ数字(I,II,III,…)になります。

<ul>タグのオプション

<ul>タグの一般パターン:<ul type=circle/disc/square>

  • type=circleと指定すると、項目頭の記号は白い丸になります。
  • type=discと指定すると、項目頭の記号は黒い丸になります。
  • type=squareと指定すると、項目頭の記号は黒い正方形になります。

<ol>タグと<ul>タグの使用例

HTML 画面表示
<ol type=A>
<li>りんご
<li>なし
<li>いちご
</ol>
  1. りんご
  2. なし
  3. いちご
<ul type=circle>
<li>りんご
<li>なし
<li>いちご
</ul>
  • りんご
  • なし
  • いちご
<ul type=disc>
<li>りんご
<li>なし
<li>いちご
</ul>
  • りんご
  • なし
  • いちご
<ul type=square>
<li>りんご
<li>なし
<li>いちご
</ul>
  • りんご
  • なし
  • いちご

<dl>タグ

<dl>タグは、キーワード定義用タグと呼ばれている。<dl></dl>で箇条書きの範囲を囲みます。
この範囲には
<dt>タグでキーワードを示す。
<dd>タグでキーワードの意味を示します。

<dl>タグの使用例

HTML 画面表示
<dl>
<dt>プロバイダ
<dd>プロバイダとは、インターネットとあなたのパソコンを接続してくれる接続事業者のことである。
<dt>ブラウザ
<dd>インターネットのホームページを見るためのソフトウェアをブラウザと呼びます。例えば、インターネットエクスプローラとネートスケープナビゲータ などがあります。
</dl>
プロバイダ
プロバイダとは、インターネットとあなたのパソコンを接続してくれる接続事業者のことである。
ブラウザ
インターネットのホームページを見るためのソフトウェアをブラウザと呼びます。例えば、インターネットエクスプローラとネートスケープナビゲータ などがあります。