基礎

HTML要素

リストアイテム

li要素

最終更新日：2019-06-10
公開日：2016-01-20

ol要素、ul要素、menu要素の項目を表す場合に使用します。

HTML サンプルコード

<ul>
  <li>ペーパードリップ</li>
  <li>インスタント</li>
  <li>フレンチプレス</li>
  <li>アイスコーヒー</li>
</ul>

カテゴリー

なし
コンテンツモデル

フローコンテンツ
使用ケース

ol要素、ul要素、menu要素の子要素として使用

属性

グローバル属性: 下記の属性に加え、グローバル属性を指定することもできます。
グローバル属性について詳しくは、「HTMLのグローバル属性」をご覧ください。
value: ol要素の子要素である場合にのみ指定できる属性です。左側に表示されるリストの値を指定することができます。

使用例

「コーヒーの淹れ方」の記事ページを想定したHTMLサンプルコード

li要素の中にol要素やul要素を入れて階層構造にすることが可能です。
また、ol要素の子要素に限りvalue属性を使用することができます。

HTML コード例

<ul>
  <li>ペーパードリップの淹れ方
    <ol>
      <li>手順1</li>
      <li>天順2</li>
      <li value="3">補足</li>
      <li value="3">補足</li>
    </ol>
  </li>
  <li>フレンチプレスの淹れ方
    <ol>
      <li>手順1</li>
      <li>天順2</li>
      <li>天順3</li>
    </ol>
  </li>
</ul>

ブラウザでの表示例