@MyQuestion

Как не переборщить с классами html с желанием потом их переиспользовать?

Добрый день!

Допустим у меня есть попап окно с похожим дизайном, но с небольшими отличиями в каждом.
Например это будет:
- форма авторизации
- форма поиска
- таблица в корзине покупок
- форма обратной связи

Всё это объединяет: скруглённые углы, шрифт, цвет фона. У форм, одинаковые инпуты и кнопки. Горизонтальные отступы между инпутами тоже одинаковые.
Но padding внутри родителя разный, некоторые отступы, немного другие, шрифт в одном из инпутов, немного другого размера. В общем есть некоторые отличия, которые говорят о неоднородности этих элементов, при их общей схожести.

Стоит ли миксовать такие блоки и громоздить кучу классов в html тег, или застилить каждый блок отдельно, копированием содержимого с некоторыми отличиями? Особенно если это не крупный проект, а средний лендинг, на 2-5 страниц?
  • Вопрос задан
  • 49 просмотров
Пригласить эксперта
Ответы на вопрос 3
inkShio
@inkShio
делай модификаторы

// стандарт
<div class="field">
  <input class="input" />
</div>

// с модификаторами
<div class="field field_big-space">
  <input class="input input_big-text" />
</div>
Ответ написан
anatoly_kulikov
@anatoly_kulikov
Помог ответ? Отметь решением!
Если css укладывается до 100кб, то мне кажется особой разницы нет. Вообще, если есть большие куски повторяемого кода, то лучше его обьединить в общие классы.
Ответ написан
BormotunJedy
@BormotunJedy
Верстальщик
Сделать одно описание стилей для form. У каждой формы есть свой name, для них прописать под стилями для form все отличия. Например:
form {
//стили для всех форм
}
form[name="Название формы"] {
//стили для этой конкретной формы
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы