HTML5におけるリスト

あらゆる種類のリストを作成できるHTML要素

新登場！ 44ページの電子書籍「CSSを44分で学ぶ」がリリースされました！ 😃

# dd

定義リストの項目を定義します。

Web: ウェブサイトとウェブページを含むインターネットの一部
HTML: ウェブページを作成するためのマークアップ言語
CSS: HTMLをより美しくするための技術

<dl>
  <dt>Web</dt>
  <dd>The part of the Internet that contains websites and web pages</dd>
  <dt>HTML</dt>
  <dd>A markup language for creating web pages</dd>
  <dt>CSS</dt>
  <dd>A technology to make HTML look better</dd>
</dl>

# dl

定義リストを定義します。

例: コピー

Web: ウェブサイトとウェブページを含むインターネットの一部
HTML: ウェブページを作成するためのマークアップ言語
CSS: HTMLをより美しくするための技術

<dl>
  <dt>Web</dt>
  <dd>The part of the Internet that contains websites and web pages</dd>
  <dt>HTML</dt>
  <dd>A markup language for creating web pages</dd>
  <dt>CSS</dt>
  <dd>A technology to make HTML look better</dd>
</dl>

# dt

定義用語を定義します。

例: コピー

Web: ウェブサイトとウェブページを含むインターネットの一部
HTML: ウェブページを作成するためのマークアップ言語
CSS: HTMLをより美しくするための技術

<dl>
  <dt>Web</dt>
  <dd>The part of the Internet that contains websites and web pages</dd>
  <dt>HTML</dt>
  <dd>A markup language for creating web pages</dd>
  <dt>CSS</dt>
  <dd>A technology to make HTML look better</dd>
</dl>

# li

順序付きリスト<ol>または順序なしリスト<ul>内のリスト項目を定義します。

例: コピー

ステップ1
ステップ2
????
利益!!!

<ol>
  <li>Step one</li>
  <li>Step two</li>
  <li>????</li>
  <li>PROFIT!!!</li>
</ol>

例: コピー

私の買い物リスト

牛乳
パン
チョコレート
もっとチョコレート

<p>My shopping list:</p>
<ul>
  <li>Milk</li>
  <li>Bread</li>
  <li>Chocolate</li>
  <li>More chocolate</li>
</ul>

# ol

順序付きリストを定義します。

例: コピー

ステップ1
ステップ2
????
利益!!!

<ol>
  <li>Step one</li>
  <li>Step two</li>
  <li>????</li>
  <li>PROFIT!!!</li>
</ol>

`type`

リストの番号付け方法を定義します。

`"1"`

デフォルト。

数字を使用します。

`"a"`

小文字を使用します。

`"A"`

大文字を使用します。

`"i"`

小文字のローマ数字を使用します。

`"I"`

大文字のローマ数字を使用します。

`start`

リストを開始する番号を定義します。

`"3"`

任意の整数を使用できます。

`reversed`

リストの順序を反転させます。

値は不要です。

# ul

順序なしリストを定義します。

例: コピー

私の買い物リスト

牛乳
パン
チョコレート
もっとチョコレート

<p>My shopping list:</p>
<ul>
  <li>Milk</li>
  <li>Bread</li>
  <li>Chocolate</li>
  <li>More chocolate</li>
</ul>