HTML - Комментарии

Комментарий - это фрагмент кода, который игнорируется любым веб-браузером. Хорошей практикой является добавление комментариев в ваш HTML-код, особенно в сложных документах, чтобы указать разделы документа и любые другие примечания для всех, кто просматривает код. Комментарии помогают вам и другим понять ваш код и повышают читаемость кода.

Комментарии HTML помещаются между <!-- ... -->теги. Таким образом, любой контент, помещенный в теги <! - ... ->, будет рассматриваться как комментарий и полностью игнорироваться браузером.

пример

<!DOCTYPE html>
<html>

   <head>  <!-- Document Header Starts -->
      <title>This is document title</title>
   </head> <!-- Document Header Ends -->
	
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Это приведет к следующему результату без отображения содержимого, указанного как часть комментариев:

Допустимые и недействительные комментарии

Комментарии не вкладываются, что означает, что комментарий нельзя поместить внутри другого комментария. Во-вторых, двойное тире «-» не может появляться внутри комментария, кроме как как часть закрывающего тега ->. Вы также должны убедиться, что в строке начала комментария нет пробелов.

пример

Здесь данный комментарий является действительным комментарием и будет удален браузером.

<!DOCTYPE html>
<html>

   <head>
      <title>Valid Comment Example</title>
   </head>
	
   <body>
      <!--   This is valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Это даст следующий результат -

Но следующая строка не является допустимым комментарием и будет отображаться в браузере. Это связано с тем, что между левой угловой скобкой и восклицательным знаком есть пробел.

<!DOCTYPE html>
<html>

   <head>  
      <title>Invalid Comment Example</title>
   </head>
	
   <body>
      < !--   This is not a valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Это даст следующий результат -

Многострочные комментарии

До сих пор мы видели однострочные комментарии, но HTML также поддерживает многострочные комментарии.

Вы можете прокомментировать несколько строк с помощью специального начального тега <! - и конечного тега ->, помещенного перед первой строкой и концом последней строки, как показано в приведенном ниже примере.

пример

<!DOCTYPE html>
<html>

   <head>  
      <title>Multiline Comments</title>
   </head> 
	
   <body>
      <!-- 
         This is a multiline comment and it can
         span through as many as lines you like.
      -->
      
      <p>Document content goes here.....</p>
   </body>
	
</html>

Это даст следующий результат -

Условные комментарии

Условные комментарии работают только в Internet Explorer (IE) в Windows, но игнорируются другими браузерами. Они поддерживаются начиная с Explorer 5, и вы можете использовать их для предоставления условных инструкций различным версиям IE.

пример

<!DOCTYPE html>
<html>

   <head>  
      <title>Conditional Comments</title>

      <!--[if IE 6]>
         Special instructions for IE 6 here
      <![endif]-->
   </head> 
   
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Вы столкнетесь с ситуацией, когда вам нужно будет применить другую таблицу стилей, основанную на разных версиях Internet Explorer, в такой ситуации будут полезны условные комментарии.

Использование тега комментария

Есть несколько браузеров, которые поддерживают тег <comment> для комментирования части HTML-кода.

Note- Тег <comment> устарел в HTML5. Не используйте этот элемент.

пример

<!DOCTYPE html>
<html>

   <head>
      <title>Using Comment Tag</title>
   </head>
	
   <body>
      <p>This is <comment>not</comment> Internet Explorer.</p>
   </body>
	
</html>

Если вы используете IE, он даст следующий результат -

Но если вы не используете IE, это даст следующий результат:

Комментирование кода скрипта

Хотя вы изучите JavaScript с HTML в отдельном руководстве, но здесь вы должны отметить, что если вы используете Java Script или VB Script в своем HTML-коде, рекомендуется поместить этот код сценария в соответствующие комментарии HTML, чтобы старые браузеры могут работать правильно.

пример

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Script Code</title>
      
      <script>
         <!-- 
            document.write("Hello World!")
         //-->
      </script>
   </head>
	
   <body>
      <p>Hello , World!</p>
   </body>
	
</html>

Это даст следующий результат -

Комментирование таблиц стилей

Хотя вы научитесь использовать таблицы стилей с HTML в отдельном руководстве, но здесь вы должны отметить, что если вы используете каскадную таблицу стилей (CSS) в своем HTML-коде, то рекомендуется поместить этот код таблицы стилей в соответствующие комментарии HTML. чтобы старые браузеры могли нормально работать.

пример

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Style Sheets</title>
      
      <style>
         <!--
            .example {
               border:1px solid #4a7d49;
            }
         //-->
      </style>
   </head>
	
   <body>
      <div class = "example">Hello , World!</div>
   </body>
	
</html>

Это даст следующий результат -