Người Viết : ViKiMi Editor

Thiết kế HTML Danh Sách các thông tin mang lại hiệu quả cao nhất trên các Trang Web
Khi làm việc với HTML Danh Sách bạn sẽ có tất cả 3 lựa chọn. Cả 3 lựa chọn này đều như nhau cách sử dụng, hiệu quả mang lại đều tốt. Ngoài Danh sách không có thứ tự HTML, chúng ta còn Danh sách có thứ tự HTML và Danh sách mô tả HTML. Tất cả danh sách HTML áp dụng cho những trường hợp cụ thể, giúp phát triển được đúng ý đồ.
HTML Lists / Danh sách HTML được vận dụng nhiều cách :
+ Đưa ra Danh sách tổng hợp các thông tin
+ Đưa ra tập hợp thông tin hướng người dùng
+ Tạo các Menu thông tin ngắn gọn cho Trang nội dung của Website
+ Tạo Menu điều hướng cho các Website , etc.
HTML Lists chia làm 3 loại :
+ Unordered HTML List / Danh sách HTML không có thứ tự
Các mục trong danh sách sẽ không được đánh dấu bằng số
+ Ordered HTML List / Danh sách HTML có thứ tự
Các mục trong danh sách sẽ được đánh dấu bằng số
+ HTML Description Lists / Danh sách mô tả HTML
Danh sách các thuật ngữ, và có kèm theo mô tả cho từng thuật ngữ
2 ] Ordered HTML List / Danh sách HTML có thứ tự
Danh sách có thứ tự bắt đầu bằng thẻ <ol>
Mỗi mục danh sách bắt đầu bằng thẻ <li>
EXAMPLE 1 ::
<!DOCTYPE html>
<html>
<body>
<h1>HTML DANH SÁCH CÓ THỨ TỰ</h1>
<p>Đặt điểm đánh dấu mục danh sách bằng số</p>
<ol>
<li>Ô tô</li>
<li>Xe Máy</li>
<li>Xe Điện</li>
<li>Nhà Cửa</li>
</ol>
</body>
</html>
Hình Ảnh Kết Quả:

Mặc định, Các mục trong HTML danh sách có thứ tự sẽ được đánh dấu bằng số.
Để có thể Chọn đánh dấu mục danh sách chúng ta sử dụng thuộc tính CSS list-style-type . Bảng giá trị có sử dụng như sau :
+ disc Đặt điểm đánh dấu mục danh sách là dấu đầu dòng (mặc định)
+ circle Đặt điểm đánh dấu mục danh sách là vòng tròn
+ square Đặt điểm đánh dấu mục danh sách là hình vuông
+ none Các mục trong danh sách sẽ không được đánh dấu
EXAMPLE 2 ::
<ol style="list-style-type: square;">
<li> Ô tô </li>
<li> Xe Máy </li>
<li> Xe Điện
<ol>
<li> Xe Điện A</li>
<li> Xe Điện B</li>
</ol>
</li>
<li> Nhà Cửa </li>
</ol>
Hình Ảnh Kết Quả:

3 ] HTML Description Lists / Danh sách mô tả HTML
HTML cũng hỗ trợ danh sách mô tả.
Danh sách mô tả là danh sách các thuật ngữ.
Có kèm theo mô tả cho từng thuật ngữ.
Và Không Áp Dụng đánh dấu mục danh sách.
+ Thẻ <dl> xác định danh sách mô tả
+ Thẻ <dt> xác định thuật ngữ (tên)
+ Thẻ <dd> mô tả từng thuật ngữ
EXAMPLE 1 ::
<!DOCTYPE html>
<html>
<body>
<h2>DANH SÁCH HTML MÔ TẢ</h2>
<p style="font-size:22px;">Không Áp Dụng đánh dấu mục danh sách</p>
<dl style="font-size:19px; margin:2%;">
<dt>Xe Ô Tô</dt>
<dd>- Lamborghini</dd>
<dd>- PEUGEOT</dd>
<dt>Xe Máy</dt>
<dd>- Yamaha</dd>
<dd>- Zuzuki</dd>
</dl>
</body>
</html>
Hình Ảnh Kết Quả :

Cuối Cùng, chúng ta thấy việc sử HTML Danh Sách rất hữu ích. Có thể sử dụng chúng cho các trường hợp phát triển Website khác nhau, nhằm mang lại hiệu quả mong muốn. HTML Danh Sách cung cấp 3 kiểu cho các trường hợp khác nhau :
+ Unordered HTML List / Danh sách HTML không có thứ tự
Các mục trong danh sách sẽ không được đánh dấu bằng số
+ Ordered HTML List / Danh sách HTML có thứ tự
Các mục trong danh sách sẽ được đánh dấu bằng số
+ HTML Description Lists / Danh sách mô tả HTML
Danh sách các thuật ngữ, và có kèm theo mô tả cho từng thuật ngữ
Tất cả mang lại sự thoải mái khi làm việc với HTML LISTS