devellopah
@devellopah

В каких ситуациях оправдано использование utility классов(bootstrap)?

В bootstrap есть много utility классов, типа .text-center,.text-lowercase, .w-100, .border-0 и так далее.
Узнать больше можно здесь
Сам фреймворк определяет их как
classes with a single purpose to reduce the frequency of highly repetitive declarations.

Некоторые из этих классов включают несколько несколько правил, некоторые только одно ( часто с флагом !important, что явно отсылает к функциональному css )

Так вот вопрос: а когда их использовать-то? Кто-то скажет: "когда хочешь, тогда и используй". Так-то оно так. Но я имею ввиду другое.

Когда их правильно использовать, а когда нет?
Здесь я набросал два примера.
В первом случае, элемент стилизуется с помощью utility классов насколько это возможно. Некоторые правила перечислены непосредственно в .my-div, посколько они мне нужны, а фреймворк не предусматривает для них utility класса. А если бы предусматривал, то это был бы не бутстрап, а tachyons

Во-втором примере, привычный вариант - все стили под одним классом.

Первый пример старается реиспользовать часто используемые css правила(это была задумка бутстрапа), однако мы получаем вот такой кипеш в html
class="my-div1 d-inline-block text-center text-uppercase w-100 font-italic py-3 my-3"


Во-втором примере, у меня только один класс(что уже неплохо, минимум кипеша в html), однако стили no reusable.
Остаётся понять, что из этого худшее зло.
Считаете ли вы, что необходимо использовать вспомогательные классы насколько это возможно(dry css) и пожертвовать тем, как будет выглядит html?
Как вы их используете?
  • Вопрос задан
  • 231 просмотр
Решения вопроса 1
@axeax
Допустим, у вас на странице будет 2 таких блока. В одном текст по центру, в другом слева. В случае с вашим css, придется полностью скопипастить блок и убрать text-align. В случае где много классов - только убрать 1 класс из элемента.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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