Comment là một phần của code mà được bỏ qua bởi bất kỳ trình duyệt nào. Thêm comment vào code của bạn là một sự luyện tập tốt, đặc biệt trong các tài liệu phức tạp, để chỉ dẫn các khu vực của tài liệu, và bất kỳ ghi chú nào khác cho ai đó tiện theo dõi code. Comment giúp bạn và người khác hiểu đoạn code của bạn để làm cho nó dễ đọc hơn. Dưới đây là cách sử dụng comment trong HTML một cách dễ hiểu nhất các bạn cùng theo dõi nhé!
Comment trong HTML được đặt trong thẻ <!-- ... -->. Vì vậy bất kỳ nội dung nào đặt trong thẻ này đều được coi như là comment và sẽ được bỏ qua bởi trình duyệt.
Ví dụ
<html>
<head> <!-- Vi du comment 1 -->
<title>Tieu de tai lieu</title>
</head> <!-- Vi du comment 2 -->
<body>
<p>Phan noi dung chinh cua tai lieu.....</p>
</body>
</html>Nó sẽ hiển thị kết quả sau và bỏ qua nội dung trong comment:
Comment hợp lệ và không hợp lệ trong HTML
Các comment không được lồng vào nhau nghĩa là một comment không thể được đặt trong một comment khác. Dãy dấu gạch ngang thứ hai "--" có thể không xuất hiện bên trong một bình luận ngoại trừ như là một phần của thẻ đóng --> tag. Bạn phải chắc chắn rằng không có dấu cách trong chuỗi khởi đầu.
Ví dụ
Dưới đây là một ví dụ về một comment hợp lệ và sẽ được bỏ qua bởi trình duyệt.
<html>
<head>
<title>Vi du comment hop le</title>
</head>
<body>
<!-- Day la mot comment hop le -->
<p>Phan noi dung chinh cua tai lieu.....</p>
</body>
</html>Ví dụ dưới đây lại là một comment không hợp lệ và được trình duyệt hiển thị. Đây là bởi vì có một dấu cách giữa dấu ngoặc nhọn và dấu chấm than.
<html>
<head>
<title>Vi du comment khong hop le</title>
</head>
<body>
< !-- Vi du comment khong hop le -->
<p>Phan noi dung chinh cua tai lieu.....</p>
</body>
</html>Kết quả hiển thị:
Comment có nhiều dòng trong HTML
Bạn đã thấy comment có một dòng, nhưng HTML cũng hỗ trợ một comment có nhiều dòng.
Bạn có thể tạo một comment nhiều dòng bằng cách sử dụng thẻ mở <!-- và thẻ đóng --> đặt trước dòng đầu tiên và dòng cuối cùng như ví dụ bên dưới.
Ví dụ
<html>
<head>
<title>Comment có nhiều dòng trong HTML</title>
</head>
<body>
<!--
Vi du mot comment co nhieu dong. Phan comment nay
co the trai rong tren nhieu dong.
-->
<p>Phan noi dung chinh cua tai lieu.....</p>
</body>
</html>Nó sẽ tạo ra kết quả sau:
Comment có điều kiện trong HTML
Comment này chỉ làm việc trên Internet Explorer trên Windows nhưng chúng được bỏ qua bởi các trình duyệt khác. Chúng được hỗ trợ cho các phiên bản IE 5 về trước, và bạn có thể sử dụng chúng để đưa các chỉ thị có điều kiện cho các phiên bản khác nhau của IE.
Ví dụ
<html>
<head>
<title>Comment có điều kiện trong HTML</title>
<!--[if IE 6]>
Phan comment cho IE 6
<![endif]-->
</head>
<body>
<p>Phan noi dung chinh cua tai lieu.....</p>
</body>
</html>Bạn sẽ tìm hiểu một tình huống mà bạn sẽ cần áp dụng một Style Sheet khác dựa trên các phiên bản khác nhau của IE, trong tình huống đó thì Comment có điều kiện sẽ rất hữu dụng.
Sử dụng thẻ comment trong HTML
Có một vài trình duyệt hỗ trợ thẻ <comment> để ghi comment cho code trong HTML.
Ví dụ
<html>
<head>
<title>Vi du the comment trong HTML</title>
</head>
<body>
<p>Trinh duyet cua ban la <comment>khong phai</comment> Internet Explorer.</p>
</body>
</html>Nếu bạn đang sử dụng trình duyệt khác, nó hiển thị:
Comment cho Script code
Nếu bạn đang sử dụng JavaSript hoặc VB Scrip trong code HTML của bạn thì nó sẽ gợi ý đặt đoạn Script code đó trong một comment HTML thích hợp để các trình duyệt cũ làm việc đúng cách.
Ví dụ
<html>
<head>
<title>Comment cho Script code</title>
<script>
<!--
document.write("Hello World!")
//-->
</script>
</head>
<body>
<p>Hello , World!</p>
</body>
</html>Nó sẽ tạo ra kết quả sau:
Comment cho Style Sheet
Nếu bạn sử dụng Casecading Style Sheet trong mã hóa HTML của bạn thì nó sẽ gợi ý đặt mã hóa Style Sheet vào trong một comment thích hợp để các trình duyệt cũ có thể làm việc đúng cách.
Ví dụ
<html>
<head>
<title>Comment cho Style Sheet</title>
<style>
<!--
.example {
border:1px solid #4a7d49;
}
//-->
</style>
</head>
<body>
<div class="example">Hello , World!</div>
</body>
</html>Kết quả hiển thị là:
