Чи варто мені використовувати селектор ID у CSS?
Загалом, хоча технічно ви можете досягти унікальності за допомогою класів, Ідентифікатори пропонують додаткові переваги з точки зору доступу до JavaScript, специфічності CSS, семантичного значення та ідентифікаторів фрагментів URL-адрес.
Ідентифікатори мають набагато вищу специфічність, ніж класи. Клас сам по собі не може перезаписувати стилі, що належать ідентифікатору. Щоб «побити» ідентифікатор, вам знадобиться або більше ідентифікаторів, або використовувати `! important`, що може розпочати війни за специфіку у ваших таблицях стилів.
Ви повинні використовувати клас, якщо вам потрібно використати той самий селектор кілька разів на сторінці чи сайті. У той час як ідентифікатор є специфічним для одного елемента, класи можуть бути призначені кільком елементам на сторінці або на всьому веб-сайті. Вони не унікальні.
Використання класів замість ідентифікаторів у селекторах CSS забезпечує більшу гнучкість і можливість повторного використання. Класи можуть бути застосовані до кількох елементів на сторінці, що забезпечує узгоджений стиль у різних частинах веб-сайту, тоді як ідентифікатори мають бути унікальними для кожного елемента.
Селектор id використовує атрибут id елемента HTML для вибору певного елемента. Ідентифікатор елемента є унікальним на сторінці, тому селектор ідентифікатора використовується для вибору одного унікального елемента! Щоб вибрати елемент із певним ідентифікатором, напишіть символ решетки (#), а потім ідентифікатор елемента.