Как добавить комментарии к каскадным таблицам стилей (CSS)

Каждый сайт состоит из структурных (которые продиктованы HTML), функциональных и стилистических элементов. Каскадные таблицы стилей (CSS) используются, чтобы диктовать внешний вид («внешний вид») веб-сайта. Эти стили хранятся отдельно от структуры HTML, чтобы упростить обновление и соблюдение веб-стандартов.

Проблема со стилями

С размером и сложностью многих веб-сайтов сегодня таблицы стилей могут стать довольно длинными и громоздкими. Это особенно актуально сейчас, когда запросы средств массовой информации для чувствительных стилей веб-сайтов являются неотъемлемой частью дизайна, гарантируя, что веб-сайт выглядит так, как должен, независимо от устройства. Только эти медиа-запросы могут добавить значительное количество новых стилей в документ CSS, что затрудняет работу с ним. Здесь комментарии CSS могут стать неоценимой помощью для разработчиков и разработчиков веб-сайтов.

Комментарии Добавить Структура и Ясность

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

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

Только для профессионалов

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

Добавление комментариев к CSS

Добавление комментария CSS довольно просто. Вы просто резервируете свой комментарий с помощью правильных тегов комментариев открытия и закрытия:

• Начните свой комментарий, добавив

  /*

• Закройте свой комментарий, добавив

  */

Все, что появляется между этими двумя тегами, - это содержимое комментария, видимое только в коде и не отображаемое браузером.

Комментарий CSS может занимать любое количество строк. Вот два примера:

/ * красная рамка пример * / div # border_red { граница: тонкая сплошная красная; }/*******************************************************Стиль для текста кода*******************************************************/

Разрушение разделов

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

/ * ----------------------- Стили заголовка ----------------------- ------- * /

Эти комментарии указывают на начало нового раздела кодирования.

Код «Комментирование»

Поскольку теги комментариев указывают браузеру игнорировать все между ними, вы можете использовать их для временного отключения определенных частей кода CSS. Это может быть удобно при отладке или при настройке форматирования веб-страницы. Фактически, дизайнеры часто используют их для «комментариев» или «выключения» областей кода, чтобы узнать, что произойдет, если этот раздел не является частью страницы.

Для этого просто добавьте тег комментария открытия перед кодом, который вы хотите прокомментировать (отключить); поместите закрывающий тег, где вы хотите, чтобы отключенная часть закончилась. Ничто между этими тегами не повлияет на визуальное отображение сайта, позволяя вам отлаживать CSS, чтобы увидеть, где происходит проблема. Затем вы можете войти и исправить только эту проблему и удалить комментарии из кода.

Советы по комментированию CSS

В качестве примера, вот несколько советов, которые нужно запомнить для использования комментариев в CSS:

1. Комментарии могут охватывать несколько строк.
2. Комментарии могут включать элементы CSS, которые вы не хотите отображать в браузере, но которые вы не хотите полностью удалять. Не забудьте удалить неиспользуемые стили (в отличие от того, чтобы оставить их прокомментированными), если вы решите, что не нуждаетесь в них на веб-сайте.
3. Используйте комментарии всякий раз, когда вы пишете сложный CSS, чтобы добавить структуру, прояснить дизайнерские решения и сообщить будущим разработчикам (или напомнить себе) о важных соображениях. Это экономит время в будущем для всех участников.
4. Комментарии также могут включать метаинформацию, такую ​​как:
   1. автор
   2. Дата создания
   3. авторское право

Спектакль

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