Leaderboard ads banner

Bố Cục HTML

Trong phần này chúng ta sẽ tạo cấu trúc HTML cơ bản cho website.

Đầu tiên bạn tạo một file HTML đặt tên là layout.html với nội dung như sau:

<!DOCTYPE html>
<html>
<head>
    <!-- page title -->
    <title>...</title>
</head>
<body>
<!-- menu -->
<div id="main-menu">
...
</div>

<!-- content -->
<div id="main-content">
...
</div>

<!-- footer -->
<div id="footer">
...
</div>
</body>
<html>

File layout.html này sẽ chứa bố cục chung dành cho các trang web của website. Hầu hết các website ngày nay sẽ chứa nhiều hơn một trang (web), với mỗi trang bao gồm mã HTML và có thể có thêm mã CSS và JavaScript.

Đối với website doanh nghiệp mà chúng ta đang làm sẽ gồm có tất cả 3 trang:

  • Trang Chủ
  • Trang Giới Thiệu
  • Trang Liên Hệ

Dù mỗi website thường có nhiều trang (web) khác nhau nhưng thông thường thì các trang web (của cùng một website) đều có một bố mục HTML gần giống nhau và chỉ khác nhau ở một số phần nội dung nhất định.

Cụ thế đối với website doanh nghiệp của chúng ta đang làm thì bố cục HTML của tất cả các trang web (xem trong file layout.html) đều gồm có các phần sau:

  • Phần tiêu đề trang nằm trong thẻ <title>
  • Phần menu nằm trong thẻ <div id="menu"> gồm danh sách cách liên kết để đi đến từng trang
  • Phần nội dung chính của trang nằm trong thẻ <div id="main-content">
  • Phần footer cuối trang nằm trong thẻ <div id="footer">

Chúng ta sẽ sử dụng mã HTML trong file layout.html này để áp dụng tạo lần lượt từng trang web của website trong các bài học tiếp theo.

Nội dung không được để trống

Hướng Dẫn Liên Quan