BÀI 4: TRÌNH BÀY NỘI DUNG THEO DẠNG DANH SÁCH, BẢNG BIỂU 

I - MỤC TIÊU BÀI HỌC

• Trình bày được nội dung dạng danh sách trên trang web.

• Tạo được bảng biểu trên trang web.

II - KIẾN THỨC CẦN GHI NHỚ

1. TẠO DANH SÁCH

a) Danh sách xác định thứ tự

- Danh sách xác định thứ tự được dùng khi thứ tự xuất hiện các mục của nó là quan trọng.

- HTML sử dụng các thẻ <ol> và <li> để tạo danh sách xác định thứ tự:

Trong đó:

+ Cặp thẻ <ol></ol> dùng để tạo danh sách.

+ Cặp thẻ <li></li> dùng để tạo các mục nội dung trong danh sách.

+ Các mục trong danh sách theo mặc định được xác định thứ tự tăng dần bằng các số nguyên bắt đầu từ 1.

- Có thể xác định thứ tự bắt đầu của danh sách bằng cách gán một số nguyên khác cho thuộc tính start trong khai báo phần tử ol.

- Để thay đổi cách xác định thứ tự các mục trong danh sách, cần thiết lập giá trị cho thuộc tính type trong khai báo phần tử ol. 

Bảng 1. Một số giá trị thuộc tính type 
thường dùng

b) Danh sách không xác định thứ tự

- Danh sách không xác định thứ tự thường được sử dụng khi thứ tự xuất hiện các mục của nó là không quan trọng.

- HTML sử dụng các thẻ <ul> và <li> để tạo danh sách không xác định thứ tự:

Trong đó:

+ Cặp thẻ <ul></ul> dùng để tạo danh sách.

+ Cặp thẻ <li></li> dùng để tạo các mục nội dung trong danh sách.

+ Theo mặc định, mỗi mục nội dung khi hiển thị trên màn hình trình duyệt web được bắt đầu bằng một dấu chấm tròn màu đen.

Lưu ý: Cách thiết lập kí tự đánh dấu các mục của danh sách không xác định thứ tự thường được sử dụng thông qua việc thiết lập CSS mà không sử dụng thuộc tính type như danh sách xác định thứ tự.

Danh sách mô tả

- Danh sách mô tả dùng để liệt kê các mục kèm với mô tả cho từng mục.

- HTML sử dụng các thẻ <dl>, <dt> và <dd> để tạo danh sách mô tả:

Trong đó:

+ Cặp thẻ <dl></dl> dùng để tạo danh sách.

+ Cặp thẻ <dt></dt> dùng để khai báo tên của các mục.

+ Cặp thẻ <dd></dd> dùng để khai báo giá trị của các mục.

2. TẠO BẢNG

- Bảng thường được sử dụng để thể hiện thông tin có cấu trúc, dùng cho thống kê, so sánh dữ liệu.

- HTML sử dụng các thẻ <table>, <tr> và <td> để tạo bảng:

Trong đó:

+ Cặp thẻ <table></table> dùng để tạo bảng.

+ Cặp thẻ <tr></tr> dùng để khai báo các hàng trong bảng.

+ Cặp thẻ <td></td> dùng để khai báo các ô dữ liệu của mỗi hàng.

- Dữ liệu trong các ô thường là văn bản, hình ảnh, siêu liên kết,… hoặc cũng có thể bao gồm các bảng khác.