Mục tiêu

Tạo layout cho trang web- luyện tập sử dụng lệnh include và require.

Mô tả- tạo layout cho trang web

Tạo trang web có layout gồm các phần header, footer, headlink, content. Các phần trong layout tách riêng từng file, sử dụng lệnh include hoặc require để triệu gọi lại file.

Các bước thực hiện

Bước 1: Tạo file header.php. Đây là file hiển thị phần header của layout.

Mã HTML:

Mã css để định dạng phần header:

Bước 2: Tạo file nav.php. Đây là file hiển thị menu của layout.

Mã HTML:

Mã css để định dạng phần header:

Bước 3: Tạo file content.php. Đây là file hiển thị phần nội dung chính của layout.

Mã HTML:

Mã css để định dạng phần header:

Bước 4: Tạo file footer.php. Đây là file hiển thị phần footer của layout.

Mã HTML:

Code css để định dạng phần footer (chung selector với phần header):

Bước 5: Tạo file index.php. File chứa mã HTML cho toàn bộ layout và nhúng các file con vừa tạo ở trên vào từng phần tương ứng.

Sử dụng lệnh include để đưa từng nội dung của các trang vào.

Mã HTML:

Bước 6: Chạy chương trình.

  • Truy cập trang index.php và quan sát kết quả.
  • Thay lệnh include bằng lệnh require, so sánh kết quả.

Qua bài tập trên bạn đã luyện tập:

  • Tạo layout với css cho trang web
  • Sử dụng lệnh include, require để nhúng nội dung của một trang php khác vào, tránh trường hợp phải tạo hay viết lại mã lệnh nhiều lần.

Mã nguồn mẫu: https://github.com/codegym-vn/include_layout

Demo: http://demo.codegym.vn/lamp/3/include_layout/

Trên đây CodeGym đã cùng với bạn luyện tập sử dụng lệnh include và require. Hãy chụp ảnh màn hình và nộp bài thực hành của bạn trên CodeGymX để cùng nhau luyện tập nhé!


Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.