Thực hành: Cho một bố cục trang web có dạng như Hình 18.1

Sách bài tập Tin học 12 Bài 18: Thực hành tổng hợp thiết kế trang web - Kết nối tri thức

Câu 18.4 trang 50 SBT Tin học 12: Thực hành: Cho một bố cục trang web có dạng như Hình 18.1. Hãy phân tích và xác định các bước để tạo một bố cục như vậy bằng thẻ <table> và bằng CSS.

Quảng cáo

Lời giải:

Hướng dẫn: Nếu sử dụng phần tử Table, cách đơn giản là em sử dụng các bảng lồng nhau. Ví dụ:

– Tạo một bảng có 4 hàng 1 cột – tức ở mức ngoài có 4 cặp <tr></tr>, mỗi cặp chỉ chứa một cặp <td></td>.

– Trong cặp <td></td> ở dòng 2, em thêm vào một bảng mới có 1 hàng, 3 cột. – Tương tự, thêm một bảng 1 hàng 2 cột ở dòng 4.

Thiết lập chiều rộng và chiều cao của các ô cho phù hợp.

Đây là một cách để thực hiện, em có thể đề xuất cách khác của mình. hiện

Nếu sử dụng CSS, cách làm giống như Nhiệm vụ 1 trong bài thực hành trên lớp. Cụ thể:

Ta xác định 4 hàng, mỗi hàng là một phần tử thuộc lớp row.

Với hàng 2 và hàng 4, ta cần tạo thêm các lớp block_3 cho hàng 2 và block_2 cho hàng 4. Lớp block_3 có độ rộng không quá 33.3% và lớp block_2 có độ rộng không quá 50%. Khi đó, hàng 2 sẽ là một phần tử row chứa 3 phần tử block_3 và hàng 4 sẽ là một phần tử row chứa 2 phần tử block_2.

Quảng cáo

Lời giải sách bài tập Tin học 12 Bài 18: Thực hành tổng hợp thiết kế trang web hay khác: