Comment trong HTML

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.

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ụ

<!DOCTYPE html>
<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:

Phan noi dung chinh cua tai lieu.....

Quảng cáo

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.

<!DOCTYPE html>
<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.

<!DOCTYPE html>
<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ị:

< !-- Vi du comment khong hop le -->

Phan noi dung chinh cua tai lieu.....

Quảng cáo

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ở  đặt trước dòng đầu tiên và dòng cuối cùng như ví dụ bên dưới.

Ví dụ

<!DOCTYPE html><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:

Phan noi dung chinh cua tai lieu.....

Quảng cáo

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ụ

<!DOCTYPE html><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ụ

<!DOCTYPE html><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 IE, nó sẽ hiển thị nội dung:

Trinh duyet cua ban la Internet Explorer.

Nếu bạn đang sử dụng trình duyệt khác, nó hiển thị:

Trinh duyet cua ban la khong phai Internet Explorer.

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ụ

<!DOCTYPE html><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:

Hello World!

Hello , World!

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ụ

<!DOCTYPE html><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à:

Hello , World!

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Bài học HTML phổ biến khác tại vietjack.com: