Hướng dẫn:

A. Các bước thực hiện lần lượt là: viết cặp thẻ

tạo bảng có độ rộng bằng 100% màn hình. Ở giữa hai thẻ ta viết sáu cặp tương ứng với sáu dòng; giữ mỗi cặp tr, ta viết bốn cặp tương ứng với bốn cột.

Lưu ý:

- Nếu không thêm dữ liệu vào bảng, để nhìn thấy kết quả cần đặt thuộc tính border = "1".

- Để dễ quan sát cấu trúc bảng có thể thêm thuộc tính height cho bảng hoặc bổ sung dữ liệu cho các ô trong bảng.

- Ta có thể sử dụng cặp thẻ thay cho cặp để xác định vị trí cho ô đầu hàng/cột.

Nên xuống dòng khi sang định nghĩa mới (ô mới, dòng mới) để đoạn mã dễ nhin, dễ kiểm tra.

B. Để cột 1 có độ rộng 40%: thêm style=“width:40%” vào thẻ td đầu tiên của hàng. Thêm style=“width:20%” vào các thẻ td còn lại của hàng.

Lưu ý: Chỉ cần thêm vào 1 hàng, không cần phải thêm vào tất cả các hàng.

C. Để gộp các ô trên cùng cột, tức là một ô sẽ gồm nhiều hàng khác nhau. Ta sử dụng thuộc tính rowspan.

Cụ thể:

– Thêm vào thuộc tính rowspan="2” vào thẻ đầu tiên trong thứ hai.

– Thêm vào thuộc tính rowspan="3" vào thẻ đầu tiên trong thứ tư. – Xoá cặp thẻ td đầu tiên trong các thẻ tr thứ ba, thứ năm và thứ sáu (là các ô

đã được gộp vào các ô ở bước trên).

Lưu ý: Nếu không xoá, cấu trúc bảng sẽ bị sai.

D. Để gộp các ô trên cùng hàng, tức là một ô sẽ gồm nhiều cột khác nhau. Ta sử dụng thuộc tính colspan. Trong các hàng thứ ba và thứ năm hiện tại, các ô định nghĩa với thẻ td nằm ở cột 2, 3 và 4. Do vậy ô 3 và 4 trong hai hàng này định nghĩa bởi thẻ td thứ hai và thứ ba.

Cụ thể:

Thêm vào thuộc tính colspan="2" vào thẻ thứ ba trong thẻ tr thứ ba và thứ năm.

– Xoá cặp thẻ td cuối cùng trong các thẻ tr thứ ba và thứ năm.

E. Đường viền của bảng có thể thiết lập bằng cách:

– Thêm thuộc tính border = “1” vào trong thẻ

Lưu ý: Khi sử dụng thuộc tính style, ta phải thêm viền cho từng ô trong bảng.

F. Tạo tiêu đề bằng thẻ caption:

vào ngay sau thẻ

Bảng 1

, trước thẻ đầu tiên.

Tham gia Cộng đồng Lazi trên các mạng xã hội
Fanpage:	https://www.fb.com/lazi.vn
Group:	https://www.fb.com/groups/lazi.vn
Kênh FB:	https://m.me/j/AbY8WMG2VhCvgIcB
LaziGo:	https://go.lazi.vn/join/lazigo
Discord:	https://discord.gg/4vkBe6wJuU
Youtube:	https://www.youtube.com/@lazi-vn
Tiktok:	https://www.tiktok.com/@lazi.vn