Соглашение по именованию CSS-селекторов
Для работы с БЭМ-сущностями необходимо ознакомиться с правилами их именования.
Основная идея соглашения по именованию — сделать имена CSS-селекторов максимально информативными и понятными. Это поможет упростить разработку и отладку кода, а также решить некоторые проблемы веб-разработчиков.
В качестве примера рассмотрим CSS-селектор menuitemvisible
. Быстрый просмотр такой записи не дает возможности определить типы БЭМ-сущностей по имени.
Добавим разделитель или каждое слово внутри фразы напишем с заглавной буквы (классический стиль CamelCase):
menu-item-visible
;menuItemVisible
.
В таком виде имя селектора явно разделяется на логические части.
Можем предположить, что:
- menu — блок,
- item — элемент,
- visible — модификатор.
В реальной жизни часто возникают более сложные и не столь однозначные случаи, решить которые помогает соглашение по именованию CSS-селекторов в БЭМ.
Существует также ряд альтернативных схем именования, основанных на принципах БЭМ.