วิธีสไตล์ Ordered List ให้เป็นตัวเลขโรมันใหญ่ด้วย CSS

เรียนรู้สไตล์ ordered list ให้เป็นตัวเลขโรมันใหญ่ (uppercase roman) ด้วย CSS

ทำ ordered list ใน HTML 用:

• <ol> tag กำหนด ordered list element
• <li> tag กำหนด list item elements

ตัวอย่าง:

<ol> <li>List item</li> <li>List item</li> <li>List item</li> </ol>

Default ordered list ใช้ regular decimal numbers:

1. List item
2. List item
3. List item

Default decimal numbers มาจาก User-Agent Stylesheet (UAS) built-in ในเบราว์เซอร์ทุกตัว CSS property: list-style-type: decimal;

วิธีเพิ่ม Uppercase Roman Numbers ด้วย CSS

สร้าง list uppercase roman numbers override default decimal style ด้วย list-style-type:

ol { list-style-type: upper-roman; }

Uppercase roman numbers example:

1. List item
2. List item
3. List item