По сути эффект один и тот же, скажут многие, ведь стили CSS можно задать так и так для элемента, но все же разница есть и сейчас рассмотрим какая.
Что это такое?
id - это уникальное имя, которое дается только одному единственному элементу. Нельзя его присвоить нескольким, это считается грубой ошибкой.
class - общее имя для элемента. Можно задавать скольким угодно элементам и все будут иметь тот же стиль. На странице может быть несколько элементов с одинаковым классом.
Кто главнее?
Если Вы присвоите одному элементу, например id="one", а также class="super" и зададите одни стили но с разными параметрами CSS для айди и класса, то браузер будет брать стили для id и игнорировать class. Например:
#one {font-size:11px;}
.super {font-size:15px;}
Тут элемент будет иметь размер шрифта 11 пикселей, а не 15.
Несколько class
Атрибут class имеет одно интересное свойство, оно же преимущество. Элементу можно задать несколько class, но не отдельно а через пробел, например:
class="super puper"
Таким образом можно выделить отдельные классы. Например, у Вас для текстовых блоков установлен один класс и нужно просто добавить еще один параметр, но только для одного блока а не всех, тогда Вам и поможет второй класс для элемента.
Якорные ссылки
Тут Вам помогут id. Если указать в ссылке путь - айди, то при нажатии Вы будете попадать на тот элемент страницы, айди которого указали. Про это подробнее в статье - Якоря и плавный переход по якорным ссылкам.
Скрипты и атрибуты
Скрипты могут быть написаны и для тех и для тех атрибутов, но например для id есть свои отдельные фокусы, которых нет для class. Одним из таких примеров - это поиск элемента по айди с помощью document.getElementById().
Мнение
Что могу сказать по этому поводу. Лично я использую id для самых главных элементов и которые точно используются лишь один раз, например для шапки или подвала, сайдбара или еще чего-то. Просто иногда встречал, что верстальщик просто случайно указывал несколько раз один и тот же ID для разных блоков меню. Еще использую для тех элементов, с которыми работают скрипты, для остальных только классы.
Данная тема раскрыта не полностью, а только частично, дабы внести ясность для тех, кто задается вопросом, что главнее. Если у Вас есть что добавить, пишите это в комментариях, это будет полезно для читателей.
На этом все, спасибо за внимание. 🙂
