Ví dụ: nhu cầu kéo dài bảng đến toàn bộ không gian của cửa sổ trình duyệt phát sinh khi thiết kế trang được đặt bên trong bảng. Giải pháp cho vấn đề này không yêu cầu viết mã phức tạp, nhưng nó liên quan đến việc tính đến một số tính năng của việc đánh dấu các trang web.
Cần thiết
Kiến thức cơ bản về HTML
Hướng dẫn
Bước 1
Đầu tiên, bạn cần làm rõ ý nghĩa của thao tác sắp tới. Trong mã HTML, các trang bảng là một tập hợp các thẻ ghép nối lồng nhau (một thẻ mở và một thẻ đóng). Thẻ ô (
) được lồng trong các thẻ chuỗi (
), và những thứ đó, lần lượt, thành các thẻ bảng (
). Trong thẻ mở của bảng, bạn có thể đặt chiều rộng và chiều cao của bảng theo cả đơn vị tuyệt đối (pixel) và tương đối (phần trăm). Với kích thước tương đối, chiều rộng và chiều cao của phần tử mẹ của bảng được lấy bằng 100%. Nếu bạn đặt một bảng trực tiếp trong phần nội dung của trang (chứ không phải trong một lớp, biểu mẫu, bảng khác, v.v.), thì kích thước của phần tử mẹ của nó sẽ là chiều rộng và chiều cao của trang. Điều này có nghĩa là để kéo dài bảng đến tất cả không gian trống, bạn cần chỉ định 100% kích thước ngang và dọc cho nó.
Bước 2
Bây giờ bạn có thể bắt đầu đưa điều này vào thực tế trong HTML. Chiều rộng và chiều cao của bảng được chỉ định bởi các thuộc tính chiều rộng và chiều cao. Vì vậy, mã bảng chỉ ra 100% kích thước theo tất cả các hướng và ví dụ: với hai ô trong một hàng, có thể trông giống như sau:
| ô bên trái của bảng | ô bên phải của bảng |
Bước 3
Chỉ định 100% chiều rộng và chiều cao sẽ đủ để kéo dài bảng nếu bạn chọn đúng chuẩn HTML mà trình duyệt sẽ đọc mã trang. Thẻ được đặt trên dòng đầu tiên của tài liệu. Bạn cần một thẻ có nội dung sau:
Bước 4
Và một điểm nữa cần được lưu ý trong mã của bạn: theo mặc định, trang được thụt vào so với các cạnh của cửa sổ một vài pixel, vì vậy bảng, ngay cả sau khi điền toàn bộ trang, sẽ không kéo dài ra toàn bộ cửa sổ. Để loại bỏ những trường không cần thiết này, bạn có thể chỉ định không thụt lề trong các thuộc tính tương ứng trong thẻ mở của nội dung trang ():
Bước 5
Khi được lắp ráp, toàn bộ mã trang với một bảng được kéo dài hết chiều rộng và chiều cao của màn hình sẽ trông như thế này:
Bàn kéo dài
| ô bên trái của bảng | ô bên phải của bảng |
