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

Когда вы создаете большие сайты, то со временем можете забыть, что именно делает та или иная часть кода страницы. И сколь хорошо бы вы ни знали код страницы на момент его написания, если вам придется вернуться к нему спустя какое-то время (или кому-либо еще понадобится просмотреть его), то именно комментарии помогут быстро разобраться с кодом. Комментарии могут располагаться в любом месте страницы, потому что не отображаются браузером. Информация в комментариях не имеет специального значения и не воспринимается как НТМL-код. Комментарии используются чаще для пояснений, например коrдa над кодом работают несколько человек или когдa необходимо временно исключить некий фрагмент кода из обработки, не удаляя ero совсем, то можно заключить такой фрагмент в комментарий, после чего он будет проигнорирован браузером.

Комментарии в HTML имеют следующий синтаксис:

<!-- Это комментарий -->

Восклицательный знак после утловой скобки означает, что это уже не НТМL-код. Текст, заключенный между тегами <!-- и --> , не отображается веб-браузером. Заметьте, что это нестандартная пара тегов, так как открывающий тег не имеет закрывающей угловой скобки, а в закрывающем теге отсутствует открывающая угловая скобка.

Комментариями можно пользоваться для того, чтобы отметить ключевые моменты в НТМL-коде, и в дальнейшем легче было в нем ориентироваться и вам, и тем, кто после вас будет редактировать код. Кроме того, можно комментировать части HTML-кода для предотвращения их отображения. В следующем примере вы увидите закомментированную гиперссылку:

Пример HTML:

Попробуй сам
<!-- Начало введения -->
    <h1>Базовый HTML</h1>
    <h2>Основные понятия</h2>
<!-- Окончание введения -->
<!-- Начало основного текста -->
   <p>HTML расшифровывается как Hyper Text Markup Language...</p>
<!-- Окончание основного текста -->
<!-- <а href="mailto : iпfo@mysite.ru">Cвязaтьcя</a> -->

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

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

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

Условные комментарии в HTML имеют следующий синтаксис:

<!--[if Условие IE Версия]>Какой-то текст<![endif]-->

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

  • lt — меньше чем;
  • lte — меньше или равно;
  • gt — больше чем;
  • gte — больше или равно;
  • ! — не равно.

В необязательном параметре «Версия» указывается номер версии браузера Internet Explorer.

Приведем несколько примеров:

<!--[if IE]>Какой-то код<![endif]--> — выполнять содержимое комментария,
если браузером является любая версия Internet Explorer; <!--[if IE 9]>Какой-то код<![endif]--> ‰ — выполнять содержимое комментария,
если браузером является версия Internet Explorer 9; <!--[if lt IE 8]>Какой-то код<![endif]-->‰ — выполнять содержимое комментария,
если в качестве браузера выступает Internet Explorer меньшей версии, чем 8; <!--[if lte IE 8]>Какой-то код<![endif]-->‰ — выполнять содержимое комментария,
если в качестве браузера выступает Internet Explorer версии, меньшей или равной указанной; <!--[if gt IE 9]>Какой-то код<![endif]-->‰ — выполнять содержимое комментария,
если в качестве браузера выступает Internet Explorer большей версии, чем указана; <!--[if gte IE 7]>Какой-то код<![endif]-->‰ — выполнять содержимое комментария,
если в качестве браузера выступает Internet Explorer версии, большей или равной указанной.

Задачи


Итоговое задание [19-20]

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

Пришло время повторить изученное и выполнить два несложных задания:

Комментарий

Используя тег комментария сделайте так, чтобы предложение: "Я стал невидимым" осталось в HTML-коде, но не отображалось браузером.

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>Комментарий</title>  
 </head>
 <body>
  <p>Я одел шапку-невидимку.</p>
  Я стал невидимым
 </body>
</html>

Без комментариев

Сделайте так, чтобы предложение в коде стало отображаться браузером.

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>Без комментариев</title>  
 </head>
 <body>
  <!--<p>Характеристикой быстроты служит физическая величина — скорость.</p>-->
 </body>
</html>






Профессия‌ ‌веб-разработчик‌
Веб-разработчик с нуля‌
Старт в программировании‌
Курс HTML/CSS‌
Школа фриланса
Курс Верстальщик 2020 - HTML 5, CSS‌
Профессия‌ тестировщик‌