16.1. Danh sách không có thứ tự (Unordered List)
Danh sách được bắt đầu với thẻ <ul>. Mỗi đối tượng trong danh sách được đặt trong cặp thẻ <li>. Danh sách sẽ được liệt kê với các kí hiệu như hình vuông, tròn và không phân biệt thứ tự giữa các đối tượng này.
Cú pháp:
<ul>
<li>Đối tượng 1</li>
<li>Đối tượng 2</li>
<li>Đối tượng 3</li>
</ul>
Ví dụ 1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>http://hoclaptrinh24.blogspot.com/</title>
</head>
<body>
<h1>Học thiết kế web - Thẻ danh sách trong HTML</h1>
<ul>
<li>Toán rời rạc</li>
<li>Kỹ thuật lập trình</li>
<li>Thiết kế website</li>
</ul>
</body>
</html>
Kết quả:
16.2. Danh sách có thứ tự (Ordered List)
Cũng giống như thể danh sách không có thứ tự (Unordered List), việc sử dụng danh sách có thứ tự (Orderd List) gần giống nhau. Chỉ khác thẻ <ol> được thay thế cho thẻ <ul>. Bên trong cặp thẻ <ol> là các đối tượng, được đặt trong cặp thẻ <li>
Cú pháp:
<ol>
<li>Đối tượng 1</li>
<li>Đối tượng 2</li>
<li>Đối tượng 3</li>
</ol>
Ví dụ 2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>http://hoclaptrinh24.blogspot.com</title>
</head>
<body>
<h1>Học thiết kế web - Danh sách có thứ tự</h1>
<ol>
<li>Toán rời rạc</li>
<li>Kỹ thuật lập trình</li>
<li>Thiết kế website</li>
</ol>
</body>
</html>
Kết quả:
16.3. Thuộc tính type trong danh sách có thứ tự ((Ordered List)
Thuộc tính type trong thẻ <ol> sẽ hiển thị danh sách được sắp xếp theo các chỉ mục như số, chữ cái, chữ số la mã,....để sử dụng, các bạn lựa chọn giá trị kiểu trong thuộc tính type.
Cú pháp:
| Thuộc tính type | Mô tả |
| type="1" | Danh sách được đánh theo số thứ tự (kiểu mặc định) |
| type="A" | Danh sách được đánh thứ tự theo chữ cái viết in |
| type="a" | Danh sách được đánh thứ tự theo chữ cái viết thường |
| type="I" | Danh sách được đánh thứ tự theo chữ số la mã in |
| type="i" | Danh sách được đánh thứ tự theo chữ số la mã thường |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>http://hoclaptrinh24.blogspot.com</title>
</head>
<body>
<h1>Danh sách có thứ tự theo chữ cái IN</h1>
<ol type="A">
<li>Lập trình web</li>
<li>Lập trình Java</li>
<li>Thiết kế website</li>
<li>Lập trình hướng đối tượng</li>
</ol>
</body>
</html>
Kết quả:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>http://hoclaptrinh24.blogspot.com</title>
</head>
<body>
<h3>Danh sách có thứ tự theo số la mã thường</h3>
<ol type="i">
<li>Lập trình web</li>
<li>Lập trình C</li>
<li>Thiết kế website</li>
<li>Lập trình PHP</li>
</ol>
</body>
</html>
Kết quả:
0 on: "[HTML] Bài 16: Cách sử dụng danh sách trong HTML"