Bài 2: Cấu trúc của một trang web bằng HTML

Tác giả: | Cập nhật: | 2 bình luận
5/5 - (4 đánh giá)

Để tạo ra một trang web tĩnh chúng ta phải sử dụng HTML để viết bố cục cho trang web và CSS để trang trí cho web. Nhưng bạn đã biết cấu trúc của một trang web bằng HTML thì nó như thế nào, bao gồm những gì chưa? Trong bài viết này mình sẽ cho các bạn thấy một web làm bằng HTML thì sẽ có cấu trúc như nào và bố cục như nào.

Cấu trúc của một trang web bằng HTML

Một tài liệu HTML được gọi là một trang web khi tập tin HTML có cấu trúc với các thành phần như sau:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Tiêu đề của trang web</title>
    </head>
    <body>
        <h1>Cấu trúc của một trang web bằng HTML</h1>
        <p>Đây là phần nội dung của website</p>
  </body>
</html>

Trong đó:

  • <!DOCTYPE html> đây không phải là 1 thẻ HTML mà nó là một thông báo cho trình duyệt web biết phiên bản HTML đang được sử dụng.
  • Cặp thẻ <html> và </html> là cặp thẻ đóng mở tài liệu HTML có nhiệm vụ khai báo cho trình duyệt biết nội dung bên trong là HTML. Cặp thẻ này bao bọc toàn bộ nội dung website và là thẻ bắt buộc.
  • Cặp thẻ <head> và </head> là thẻ chứa các thông tin của web. Thường sẽ chứa các cặp thẻ khai báo thông tin web (meta), tên web (title), khai báo file CSS (style web), Javascript và một số thông tin khác.
  • Cặp thẻ <body> và </body> là thẻ chứa nội dung của web. Đây là phần quan trọng, nó chứa các đoạn code HTML dùng để hiển thị nội dung web cho người dùng trên trình duyệt.
  • Các cặp thẻ khác nằm trong cặp thẻ <body> chính là các thẻ định dạng dữ liệu trong tài liệu HTML.

Sau đó bạn lưu file lại với đuôi mở rộng là .html hoặc .htm. Sau đó mở file HTML đó bằng trình duyệt coi xem sao nhé.

Lời kết

Trên đây là toàn bộ những gì có trong một trang web HTML. Cấu trúc của nó gồm có 2 phần chính là phần đầu <head> và phần nội dung <body>. Và là bạn đã có thể tự tạo 1 trang web đơn giản bằng HTML rồi đó. Nhớ theo dõi bài viết tiếp theo của NguyenHung.Net để bạn tìm hiểu thêm về HTML nhé.

Nguyễn Hùng

Internet là nơi mình học được những gì về Wordpress, SEO, SEM, MMO và kiến thức máy tính. Những chia sẻ của mình là những thứ mình học được và đã làm thành công, có thể nó chưa được hoàn hảo nhưng nó sẽ hữu ích với bạn.

Nhận thông báo
Thông báo qua email khi
guest

2 Bình luận
Phản hồi nội tuyến
Xem tất cả bình luận
Minh Duc

Nếu blog của mình dùng 1 template khác nhưng có vài bài viết mình muốn cho bài viết đó sinh động hơn thì mình chèn CSS vào bài viết đó thôi được không anh. A có thể cho e link hướng dẫn về CSS trên wweb để e theo dõi k?

Trả lời
Nguyễn Hùng

Hiện tại mình chưa có thời gian để viết các bài học về CSS nên chưa có trên blog bạn nhé. Còn bạn muốn tạo CSS riêng cho bài viết nào đó thì bạn có thể gán ID hoặc class riêng cho bài đó rồi CSS thôi. Còn nếu bạn đang dùng WordPress thì bạn có thể tham khảo plugin WP Add Custom CSS nó giúp tùy chỉnh CSS riêng cho từng bài được đó.

Trả lời