Thực hành: Viết đoạn mã HTML để tạo:
A. Một bảng kích thước 6 x 4 (ô) có độ rộng bằng 100% chiều rộng của màn hình.
B. 4 cột trong đó cột 1 có độ rộng 40%, các cột 2, 3, 4 có độ rộng 20% chiều rộng bảng.
C. Gộp hai ô 2, 3 và ba ô 4, 5, 6 của cột 1.
D. gộp các ô 3, 4 của cột 3 và cột 5
E. Thiết lập đường viền cho bảng
F. đặt tiêu đề cho bảng lả Bảng 1
Bằng cách nhấp vào Đăng nhập, bạn đồng ý Chính sách bảo mật và Điều khoản sử dụng của chúng tôi. Nếu đây không phải máy tính của bạn, để đảm bảo an toàn, hãy sử dụng Cửa sổ riêng tư (Tab ẩn danh) để đăng nhập (New Private Window / New Incognito Window).
Hướng dẫn:
A. Các bước thực hiện lần lượt là: viết cặp thẻ
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ẻ
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ẻ
– Thêm vào thuộc tính rowspan="3" vào thẻ
đã đượ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ẻ
– 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ẻ
Hôm nay bạn thế nào? Hãy nhấp vào một lựa chọn, nếu may mắn bạn sẽ được tặng 50.000 xu từ Lazi
Vui | Buồn | Bình thường |