Хочу сьогодні розглянути таке питання, навіщо потрібні в css кілька класів для одного елемента? А також розібрати, в яких випадках це необхідно.
Навіщо писати кілька класів одному елементу в css?
Отже, давайте я наведу простий приклад коду, де у кожного div є кілька класів:
Що це дає? Ми можемо стилізувати все 3 блоку за допомогою одного селектора, а потім до кожного застосувати якесь оформлення, яке буде відрізняти його від інших.
Всі 3 блоку отримають однакові розміри, рамку і стануть в один рядок. А тепер ми можемо звернутися до унікальних класів, у кожного блоку він різний. Таким чином ми скоротили код. Замість того, щоб визначати всі властивості для кожного блоку, ми винесли загальні в окремий клас, а унікальні пропишемо в іншому класі.
Загалом, виділити кожен блок в окремий колір можна було б і по-іншому, дивіться статтю про роботу з властивістю nth-child. де я розглядаю цю тему.
Інший приклад, коли блоку задається кілька класів, це коли використовується css фреймворк. Наприклад, Bootstrap. В такому випадку один html елемент може отримати багато класів. Один відповідає за колір, інший - за позиціонування, третій - за видимість і т.д. і т.п.
Загалом, кілька класів потрібні для того, щоб загальні властивості елементів прописати разом, а унікальні - в окремих унікальних класах.
Вам також може бути цікаво