「リスト」に関連するタグ名、属性名、使い方。【HTML・解説・初心者向け】| ノブレコ

リスト作成に関する解説

この記事では、HTMLにおける「リスト」についての解説をしています。

主に「リスト」に関する、タグ名、属性、使い方についての紹介です。

リスト項目を使っての文章作りは、見る側にも分かりやすく要点をまとめやすいので、是非覚えておきたいですよね。

参考程度によろしければ見ていって下さい!

リストを作成するためのタグ

HTMLにリストを作成するには大きく分けて3つの種類があります。

<ul>

ulタグは、「unordered list」の略で、順序がない箇条書きリストのこと。

ブロックレベル要素で、使用には開始タグ、終了タグが必須。

記述例:

実行結果:

何もしない場合は黒丸で表示される

<ol>

olタグは、「ordered list」の略で、順序がある箇条書きリストのこと。

ブロックレベル要素で、使用には開始タグ、終了タグが必須。

記述例:

実行例:

番号順にリストが作成される

<dl>

dlタグは、「definition list」の略で、用語と説明といったような定義でリストを示すタグのこと。

ブロックレベル要素で、使用には開始タグ、終了タグが必須。

記述例:

実行例:

用語と解説をペアにする場合は、dlタグの子要素である以下の2つのタグを使用します。

また、子要素として<ulタグ>や<li>タグも使用可能。

dtタグ
「definition team」」の略で、定義語を示すタグ。
ddタグ
「definition description」の略で、定義の解説を示すタグ。

リストに関連する属性について

指定できる属性にはtype属性やstart属性、compact属性などが挙げられますが、これらの属性は非推奨です。

その代替えとして。

type属性はマーカーの形を指定するものですが、代わりに、CSSの「list-style-type」プロパティで値に形を指定し使用します。

start属性は指定した番号からリスト化するものですが、代わりに、CSSの「counter-reset/cunter-increment」プロパティを使用します。

compact属性はリストをコンパクトにするものですが、代わりに、CSSの「line-height」プロパティで値に数値指定をして使用します。


まとめ

今回は、初心者向けにHTMLにおける「リスト」の作成に関しての内容をご紹介しました。

基本的なことを記述しましたが、応用も覚えて上手く使いこなしていきたいですね。

最後まで読んでいただき、ありがとうございました(❁´◡`❁)

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA