Kiểu và vị trí của danh sách không có thứ tự và có thứ tự có thể được định dạng bởi thuộc tính CSS với kiểu danh sách, kiểu danh sách-hình ảnh và kiểu danh sách.
Cú pháp
Cú pháp của thuộc tính kiểu danh sách CSS như sau -
Selector { list-style: /*value*/ }
Ví dụ
Các ví dụ sau minh họa thuộc tính kiểu danh sách CSS -
Danh sách có thứ tự kiểu mẫu sau đây -
<!DOCTYPE html> <html> <head> <style> ol { list-style: upper-roman; line-height: 150%; } </style> </head> <body> <h2>Latest C# Versions</h2> <ol> <li>C# 8.0</li> <li>C# 7.3</li> <li>C# 7.2</li> <li>C# 7.1</li> <li>C# 7.0</li> </ol> </body> </html>
Đầu ra
Điều này cho kết quả sau -
Ví dụ
Ví dụ sau kiểu danh sách không có thứ tự -
<!DOCTYPE html> <html> <head> <style> ul > ul{ list-style: circle inside; } li:last-child { list-style-type: square; } </style> </head> <body> <h2>Programming Languages</h2> <ul> <li>C++ programming language created by Bjarne Stroustrup as an extension of the C programming language.</li> <li>Java programming language developed by James Gosling.</li> <ul> <li>Core Java</li> <li>Advanced Java</li> </ul> <li>Scala is a modern multi-paradigm programming language designed to express common programming patterns in a concise, elegant, and type-safe way.</li> </ul> </body> </html>
Đầu ra
Điều này cho kết quả sau -