Các thành phần của HTML

Một tài liệu HTML được xây dựng bởi các thành phần HTML.


Các thành phần của tài liệu HTML

Các thành phần của HTML được gọi là các thẻ (tag) với thẻ đóng, thẻ mở và nội dung ở giữa.

<tên_thẻ>nội dung</tên_thẻ>

 Các phần của tài liệu HTML là mọi thứ nằm trong cặp thẻ này.

Ví dụ:

Thẻ mở Nội dung Thẻ đóng
<h1> Đề mục của tôi </h1>
<p> Đoạn văn của tôi </p>
<br> "Xuống dòng"  

Cấu trúc bao đóng của HTML

Một tài liệu HTML có cấu trúc bao đóng, hay còn gọi là cấu trúc tổ chim (nested), có nghĩa là thành phần tài liệu này có thể chứa các thành phần khác trong nó.

Xét ví dụ cơ bản:

<!DOCTYPE html>
<html>
<body>

<h1>Đề mục của tôi</h1>
<p>Đây là đoạn văn của tôi.</p>

</body>
</html> 

Giải nghĩa các thành phần trong ví dụ trên:

  • Thẻ <html> dùng để định nghĩa toàn bộ tài liệu HTML.
    • Có thẻ mở <html> và thẻ đóng </html>.
  • Thẻ <body> dùng để định nghĩa phần thân của một trang web.
    • Có thẻ mở <body> và thẻ đóng </body>.
  • Thẻ <body> là một thành phần của HTML ở trên và nó chứa 2 thành phần khác:
    • Một đề mục cấp 1 được định nghĩa bằng thẻ <h1></h1>.
    • Một đoạn văn được định nghĩa bằng thẻ <p></p>.

Chú ý: Thẻ mở nào được ghi trước thì thẻ đóng tương ứng của nó phải viết sau các phần tử khác (tạo thành bao đóng).


Đừng quên thẻ đóng

Khi viết mã HTML bạn đừng quên viết thẻ đóng sau khi đã có thẻ mở. Làm như vậy trang web của bạn sẽ hiển thị không đúng như những gì bạn muốn.

Một ví dụ sai khi không đóng thẻ:

<html>
<body>

<p>Đoạn văn của tôi
<p>Đoạn văn của tôi

</body>
</html>

Đừng bao giờ quên đóng thẻ như ví dụ trên.


Thẻ chỉ có thẻ mở

Có một số thẻ HTML chỉ có thẻ mở mà không có thẻ đóng tương ứng. Những thẻ này hoặc đơn giản (như <br>) hoặc đã có đủ thông tin qua các thuộc tính của nó.

Một số thẻ chỉ có thẻ mở:

  • <br>
  • <img>
  • <embed>
  • <link>

Các thẻ này có thể khai báo đóng ngay trong thẻ mở dạng: <br />

HTML không bắt buộc phải đóng thẻ như trên. Tuy nhiên nếu bạn muốn ghi mã một cách đúng quy cách thì viết như vậy là một cách làm tốt.