Bagaimanakah Saya Boleh Mencipta Senarai Tertib dengan Numerasi Abjad Huruf Kecil dan Tanda Kurung Kanan Menggunakan CSS?

Membuat Senarai Tertib dengan Alfa Bawah dan Tanda Kurung Kanan

Gaya senarai tersusun lalai untuk pengangkaan alfa rendah menggunakan titik. Walau bagaimanapun, adakah mungkin untuk mengubah suai gaya ini dan menggunakan kurungan yang betul?

Menyesuaikan Gaya Senarai Tertib

Menggunakan pembilang CSS, kami boleh mewujudkan gaya senarai tersuai. Begini cara kita boleh mencapai hasil yang diingini:

ol {
  counter-reset: list;
}

ol > li {
  list-style: none;
}

ol > li:before {
  content: counter(list, lower-alpha) ") ";
  counter-increment: list;
}

Untuk menunjukkan penyelesaian ini:

<span>Custom List Style Type (v1):</span>
<ol>
  <li>Number 1</li>
  <li>Number 2</li>
  <li>Number 3</li>
  <li>Number 4</li>
  <li>Number 5</li>
  <li>Number 6</li>
</ol>

Gaya tersuai ini kini akan memaparkan item senarai tersusun dengan angka alfa rendah diikuti dengan tanda kanan kurungan:

a) Nombor 1
b) Nombor 2
c) Nombor 3
d) Nombor 4
e) Nombor 5
f) Nombor 6

Perhatikan bahawa anda mungkin perlu melaraskan padding atau aspek penggayaan lain agar sesuai dengan keperluan khusus anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta Senarai Tertib dengan Numerasi Abjad Huruf Kecil dan Tanda Kurung Kanan Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!