Ô trải ngang và ô trải dọc
Đặt `colspan="3"` trên một th hoặc td để ô ấy chiếm ba cột theo chiều ngang. Đặt `rowspan="2"` để ô chiếm hai hàng theo chiều dọc, gồm hàng bắt đầu và hàng tiếp theo.
Các số này là **tổng số cột hoặc hàng mà ô chiếm**, không phải số thêm vào ngoài ô ban đầu. Các vị trí đã thuộc ô gộp không được viết thêm ô khác trùng chỗ.
Hai hàng tiêu đề của bảng bốn cột
```html
<tr>
<th rowspan="2">Nhóm</th>
<th colspan="3">Buổi</th>
</tr>
<tr>
<th>Thứ 2</th><th>Thứ 4</th><th>Thứ 6</th>
</tr>
```
Hàng đầu viết **hai ô**: Nhóm chiếm cột 1; Buổi chiếm cột 2–4. Hàng thứ hai chỉ viết **ba ô**, vì cột 1 còn do ô Nhóm ở hàng trước chiếm.
Hai hàng tiêu đề có năm phần tử th nhưng phủ tám vị trí của lưới hai hàng × bốn cột. Các hàng dữ liệu bên dưới viết đủ bốn ô nếu không có gộp khác.
Không thêm ô vào chỗ đã có rowspan
Nếu thêm một th Nhóm nữa vào đầu hàng thứ hai, ô Nhóm cũ vẫn chiếm cột 1. Ô mới không thay thế ô cũ mà làm các ô còn lại dịch sang các cột sau, khiến bảng sai dự kiến.
Cách kiểm là vẽ lưới, đánh dấu vị trí còn bị chiếm từ hàng trước, rồi chỉ viết ô cho các vị trí còn trống. Không đếm số cặp th/td trong mỗi hàng rồi kết luận chúng phải luôn bằng số cột.
Bài luyện
Một ô có colspan="3" chiếm tổng cộng bao nhiêu cột?
Một là khi không trải thêm cột.
Giá trị colspan đã cho là 3.
Đúng. Giá trị là tổng số cột ô chiếm.
Không cộng thêm một vào giá trị colspan.
Lời giải
colspan3 cho biết ô trải qua ba cột tất cả. Nó không có nghĩa giữ một cột ban đầu rồi thêm ba, nên tổng là ba, không phải bốn.
Bài luyện
Trong mẫu, vì sao hàng tiêu đề thứ hai chỉ viết ba th?
Không có thao tác xóa ngẫu nhiên; mã chủ động bỏ vị trí đã chiếm.
Đúng. Ba vị trí còn lại là các ngày.
caption không chiếm cột của lưới bảng.
Toàn bảng vẫn có bốn cột logic.
Lời giải
Ô Nhóm bắt đầu ở hàng đầu và có rowspan2 nên chiếm cột1 của cả hai hàng. Hàng thứ hai chỉ cần ba th cho cột2–4, giữ đúng bảng bốn cột.
Bài luyện
Hai hàng tiêu đề của mẫu có bao nhiêu phần tử th thực sự được viết?
Ô gộp chiếm nhiều vị trí nhưng vẫn là một phần tử th.
Cộng hai và ba không ra bảy.
Số phần tử ô không nhất thiết bằng số cột.
Đúng. Cần đếm các phần tử, khác số vị trí chúng chiếm.
Lời giải
Hàng đầu có th Nhóm và th Buổi, tức hai phần tử. Hàng thứ hai có ba th cho ba ngày. Tổng năm th, mặc dù các ô ấy phủ tám vị trí của lưới2×4.
Bài luyện
Nếu thêm một th vào đầu hàng thứ hai như tình huống lỗi, điều nào đúng?
Đúng. Cần bỏ ô thừa thay vì trông chờ trình duyệt sửa ý định.
Thêm th không tự xóa thuộc tính rowspan cũ.
Không có quy tắc tự giảm colspan như vậy.
Trình duyệt không sửa lại tệp nguồn theo ý định người soạn.
Lời giải
Ô Nhóm cũ vẫn chiếm cột1 ở hàng thứ hai. Thêm ô tại hàng đó tạo thêm phần tử ô được đặt vào vị trí tiếp theo còn trống, đẩy các ngày sang phải và làm lưới khác dự kiến.
Đang học