はじめに
HTMLで箇条書きをしたいのですが、どうすればいいですか。
HTMLで箇条書きをするためには、ol,ul,liなどのタグを使います。
3つもあるんですね。どういった違いがあるんですか?
そうですね。このol,ul,liを説明をサンプルを使いながら行っていきましょうか。
箇条書きをする
箇条書きをするには、ol,ul,liタグを使用します。基本的に [ ol , li ] , [ ul , li ]の2つの組み合わせを使うことが多いです。[ ol , li ]を使う際には、箇条書きとして書く要素に順序がある場合に使用します。一方 [ ul , li ]を使う際には、箇条書きとして書く要素に順序がない場合に使用します。
サンプルコード
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>箇条書きを書く</title>
</head>
<body>
<p>順序のある箇条書き</p>
<ol>
<li>リストA</li>
<li>リストB</li>
<li>リストC</li>
</ol>
<p>順序のない箇条書き</p>
<ul>
<li>リストA</li>
<li>リストB</li>
<li>リストC</li>
</ul>
</body>
</html>
サンプルコード動作例
順序のある箇条書き
- リストA
- リストB
- リストC
順序のない箇条書き
- リストA
- リストB
- リストC
上記のようにolで囲むのかulで囲むのかで使用用途が変わってきます。