Разница между class и id в CSS

Атрибуты элементов в CSS часто становятся предметом споров профессионалов и любителей. Надо ли применять тот или иной, насколько целесообразно это при идентичном результате, какой код будет менее затратным и более правильным, и подобные этим вопросы обсуждаются непрестанно, в том числе и затрагивая атрибуты class и id.

Содержание статьи

Определение

Div class — атрибут элемента, приписывающий его к какому-либо классу.

Div id — атрибут элемента, однозначно его идентифицирующий.

к содержанию ↑

Сравнение

Разница между class и id в CSS кардинальной не считается, и часто применяется тот или иной в зависимости от пристрастия автора. Основное отличие class от id состоит в том, что первый может даваться нескольким элементам, второй же уникален и присваивается одному элементу на странице. Использование div id позволяет избежать многоуровневой вложенности, которая получается при использовании div class.

Кроме того, атрибут id, в отличие от class, может использоваться для якорных ссылок, для этого достаточно дать его элементу и сослаться на этот элемент якорем. Также у id будет приоритет в таблице CSS, если задан он одновременно с class. Последний, в свою очередь, позволяет применять множество классов к одному элементу. Названия классов могут записываться через пробелы, идентификатор такого обращения не предполагает. Еще одно преимущество id — в возможности поиска элемента в коде по этому атрибуту с помощью функции document.getElementById().

к содержанию ↑

Выводы TheDifference.ru

  1. Div class — приписывает класс элементу, div id — идентифицирует.
  2. Class присваивается множественным элементам, id уникален на странице.
  3. Одному элементу может быть присвоено множество классов посредством class, и только один id.
  4. Приоритет в CSS остается за id.
  5. Поиск в коде по атрибуту id осуществляется легче.