@EarthFM

Как делать кнопки БЭМ?

Сразу скажу, сайты с помощью БЭМ-а не делал)
На сайте будут кучу кнопок и не одинаковых, я правильно понял, что создаём блок .btn, а дальше если кнопка search, то создаём модификатор .btn_search и т.д. То есть для каждого типа кнопок создаём модификатор? (.btn_search, .btn_submit)
  • Вопрос задан
  • 1050 просмотров
Решения вопроса 2
Zoxon
@Zoxon
Веб-разработчик
Моя реализация бэм кнопок
button.styl
Ответ написан
Комментировать
@ilyarsoftware
Все верно, основной класс .btn описывает общий стиль, а .btn_search модификацию или дополнение, применяем следующим образом:

<div class="btn btn_search">search</div>

Стоит отметить, что .btn_search т.н. булев модификатор, по методологии может быть еще модификатор вида «ключ-значение» .btn_type_search (см. подробнее Соглашение по именованию/Имя модификатора). Предположу, что для вашей задачи больше подойдет модификатора вида «ключ-значение»:

<div class="btn btn_type_search">search</div>
<div class="btn btn_type_submit">submit</div>


Рекомендую посмотреть на блок button из библиотеки bem-components.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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