Thành phần trong HTML – Cách sử dụng HTML hợp lý – Học HTML


LinkVietVip.Com là một website miễn phí, nơi mà bạn có thể rút gọn liên kết miễn phí và kiếm thu nhập từ việc chia sẻ liên kết rút gọn đó của mình.
Download, Tải về, Tải Xuống, Down,Mở,Xem, Open, Load, Tiếp Tục,Chơi, Chơi Game,Continue, Reading,Xem tiếp, Xem thêm, Chuyển hướng tới địa chỉ bên ngoài vui lòng xem bên dưới.

Một website HTML được tạo ra nhờ các thành phần HTML nhưng không phải sử dụng html như thế nào cũng được coi là hợp lý. Có nhiều thói quen sử dụng để soạn thảo HTML sẽ gây trở ngại lớn cho quá trình viết cũng như tìm lại các lỗi, làm mất thời gian và công sức của chúng ta. Trong bài viết này mình sẽ giới thiệu một số thành phần trong HTML và mẹo sử dụng sao cho hợp lý các dạng thẻ HTML.

Thành phần HTML

Thành phần trong HTML được tạo nên bởi thẻ mởthẻ đóng và nội dung ở giữa 2 thẻ

<thẻ>nội dung</thẻ>

  • Thẻ mở là thẻ đằng trước không có dấu / ( ví dụ <h1>).
  • Thẻ đóng là thẻ đằng sau nội dung có dấu / (ví dụ </h1>).
  • Nội dung là ký tự hoặc hình ảnh hoặc kể cả một đoạn code nào đó được bao bọc bởi thẻ mở và thẻ đóng.

Thành phần HTML là mọi thứ từ thẻ mở tới thẻ đóng

<p>Đây là đoạn văn bản</p>

Thẻ mởNội dungThẻ đóng
<h1>Đề mục lớn</h1>
<p>Đoạn văn bản</p>
<br>  

Chú ý: Một vài thành phần HTML không có thẻ đóng ví dụ như thẻ <br>.

Thành phần HTML lồng nhau

Các thành phần của HTML có thể lồng vào nhau (thành phần này chứa thành phần kia, hay nói theo cách nôm na là thành phần cha và thành phần con,hay có thể diễn giải theo cấp bậc từ trong ra ngoài).

Ví dụ dưới đây chứa 4 thành phần HTML:

<!DOCTYPE html>
<html>
<body>
<h1>Đề mục</h1>
<p>Nội dung đoạn văn bản.</p>
</body>
</html>

Giải thích về ví dụ

Thành phần <html> định nghĩa toàn bộ trang.

Nó có thẻ mở là <html> và thẻ đóng </html>.

Nội dung trong thành phần <HTML> là một thành phần HTML khác (thành phần <body>).

<html>
<body>
 <h1>Đề mục</h1>
 <p>Nội dung đoạn văn bản.</p>
</body>
</html>

Thành phần <body> định nghĩa nội dung trang.

Nó có thẻ mở là <body> và thẻ đóng </body>.

Thành phần nội dung body chứa 2 thành phần HTML khác đó là (<h1> và <p>).

<body>
 <h1>Đề mục</h1>
 <p>Nội dung đoạn văn bản.</p>
</body>

Thành phần <h1> định nghĩa đề mục của trang.

Nó có thẻ mở là <h1> và thẻ đóng </h1>.

Nội dung thành phần là: Đề mục

 <h1>Đề mục</h1> 

Thành phần <p> định nghĩa một đoạn văn bản.

Nó có thẻ mở là <p> và thẻ đóng </p>.

Nội dung thành phần là : Nội dung đoạn văn bản.

<p>Nội dung đoạn văn bản.</p>

Đừng quên đóng thẻ

Một vài thành phần HTML vẫn sẽ hiển thị đúng nếu bạn quên thẻ đóng

<html>
<body>
  <p>Đây là đoạn văn bản
  <p>Đây là đoạn văn bản
</body>
</html>

Ví dụ ở trên vẫn hiển thị đúng trên tất cả các trình duyệt bởi vì thẻ đóng được coi là không bắt buộc, nhưng đó chỉ là một số thẻ đặc biệt, một vài thẻ nếu không đóng nó sẽ hoạt động đến hết toàn trang thì thôi.

Ví dụ: Đối với thẻ <b> là thẻ làm đậm văn bản, nếu bạn không đóng thẻ này lại thì toàn bộ văn bản bắt đầu từ chỗ mở thẻ b sẽ bị tô đậm tới hết trang thì thôi.

ĐỪNG BAO GIỜ LÀM ĐIỀU NÀY. Nó có thể mang lại kết quả hoặc những lỗi không mong muốn nếu bạn quên đóng thẻ.

Thành phần HTML rỗng

Thành phần HTML không có nội dung được gọi là thành phần rỗng.

<br> là một thành phần rỗng không có thẻ đóng (Thẻ <br> dùng để xuống dòng).

Thành phần rỗng có thể “đóng” ngay trong thẻ mở: <br />.

HTML5 không yêu cầu thẻ rỗng cần phải đóng. Nhưng nếu bạn muốn mã nguồn mình viết chặt chẽ hơn, để các công cụ phân tích cú pháp XML có thể đọc được, hãy đóng tất cả các thẻ HTML. Hãy tự luyện cho mình cấu trúc đóng mở hợp lý để thuận tiện kiểm tra nếu phát sinh lỗi không mong muốn nhé.Thẻ nào mở sau cùng thì đóng thẻ đó đầu tiên để ta có thể phân biệt rõ dàng hơn.

Tuy nhiên có nhiều trường hợp đặc biệt khác đóng mở sẽ không cần theo quy củ như mình nói, nhưng chỉ khi bạn biết tác dụng và cách triển khai HTML hợp lý đã ^^.

Viết thường các thẻ HTML

Thẻ HTML không phân biệt viết hoa, viết thường: <P> cũng tương tự như <p>.

Chuẩn HTML5 không yêu cầu viết thường nhưng tổ chức W3C khuyến cáo nên viết thường các thẻ trong HTML4 và yêu cầu phải viết thường cho những kiểu tài liệu có cấu trúc chặt chẽ như XHTML.

Tổng Kết:

Ở bài viết này chúng ta đã biết được các thành phần trong HTML,như thế nào là HTML lồng nhau, cách soạn thảo cấu trúc HTML sao cho hợp lý.

Nếu có bất kỳ thắc mắc hay góp ý nào về bài viết này hãy để lại bình luận cho tôi phía dưới nhé. Chúc các bạn học tốt với HTML Online ^^.



Leave a Reply

Your email address will not be published.


*