CSS のリストは、コンテンツまたは項目を特定の方法でリストする方法を決定します。つまり、それらを整然と配置することも、ランダムに配置することもでき、きれいな Web ページの作成に役立ちます。適応性があり、扱いが簡単なため、大量の資料を整理するのに使用できます。リストのデフォルトのスタイルはボーダーレスです。リストは 2 つのカテゴリに分類できます。
次の CSS リスト プロパティは、CSS リストの制御に使用できます。
ここでは、例を通してこれらの特性について詳しく学びます。
リスト形式のプロパティ
マーカーのデフォルトのリスト タイプは、正方形、円、ローマ数字、ラテン文字など、他のさまざまなタイプに変更できます。順序なしリストの項目は丸い黒丸 (・) で示されますが、順序付きリストの項目にはデフォルトでアラビア数字 (1、2、3 など) を使用して番号が付けられます。
値を none に設定すると、マークまたは箇条書きは削除されます。
構文:
リストスタイルタイプ:値;
配列リストのメソッド
値は次のように使用できます。
- 丸
- 10 進数、例:1、2、3 など
- 10 進数の先頭のゼロ、例:01、02、03、04 など
- 下ローマ字
- 上部ローマ字
- 低位アルファ、例: a、b、c など
- 上位アルファ、例: A、B、C など
- 四角
注: デフォルトのパディングとマージンもリストに含まれます。にpadding:0とmargin:0を追加する必要があります。そしてこれを解消するためのタグです。
- これを解消するためのタグです。
例
この例では、いくつかのリスト スタイルのタイプと値が正方形と上位アルファなどに設定された CSS リストを示しています。
Example for CSS Lists .num{ list-style-type:decimal; } .alpha{ list-style-type:upper-alpha; } .circle{ list-style-type:circle; } .square{ list-style-type:square; } .disc{ list-style-type:disc; } <h2> Ordered Lists </h2> <ol class="order"> <li>ONE</li> <li>TWO</li> </ol> <h2> Unordered lists </h2> <ul> <li>ONE</li> <li>TWO</li> </ul>
出力