【HTML Living Standard】ol要素の使い方
ol要素の使い方について、初心者にもわかりやすく解説します。
基本的な使い方
olオブジェクトは、順序付きリストを表すオブジェクトです。この要素は、Webページ上で項目に明確な順番があるコンテンツを表現する際に使用されます。例えば、料理のレシピの手順、タスクのステップ、ランキングの表示など、各項目が特定の順序で並んでいることが重要な場面で活用されます。
ol要素の中には、リストの各項目を示すli(リストアイテム)要素が子要素として含まれます。ブラウザはデフォルトで、これらのli要素の前に数字のマーカー(1, 2, 3...)を自動的に表示します。このマーカーの種類は、type属性を用いることで、小文字のアルファベット(a, b, c...)、大文字のアルファベット(A, B, C...)、小文字のローマ数字(i, ii, iii...)、または大文字のローマ数字(I, II, III...)に変更することが可能です。
さらに、start属性を指定することで、リストの開始番号を任意の整数値に設定できます。また、reversed属性を含めることで、リストの項目を降順(逆順)に表示させることも可能です。これらの属性を活用することで、リストの表現を柔軟に制御できます。
ol要素は、単に見た目を整えるだけでなく、コンテンツのセマンティックな意味(情報の構造)を正確に伝える役割を持っています。これにより、利用者はもちろんのこと、検索エンジンや支援技術にとっても、リストの項目に順序があることが明確に理解され、情報のアクセシビリティと検索性が向上します。システムエンジニアとしてWebページを設計する際、順序が重要な情報を表示する場合には、ol要素を適切に利用することが推奨されます。
構文(syntax)
1<ol> 2 <li>最初のリスト項目</li> 3 <li>次のリスト項目</li> 4 <li>最後のリスト項目</li> 5</ol>
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません