Комментарии 19
Официальное видео ожидается в течение месяца-двух, пока что у нас есть только «пиратская» запись.
0
Я тут BEM генератор набросал: limonte.github.io/bem-classname-generator :) Утрирую конечно, но «прелесть» BEM, думаю, показал.
+3
Чем решение вида:
хуже:
.block .element {
}
хуже:
.block__element{
}
+1
Тем, что .element может быть у другого вложенного блока и это правило его затронет.
+1
Ну и замечательно, значит стиль в .element должен быть написан так, чтобы он затрагивал все однотипные блоки.
+1
Это разные элементы разных блоков с одинаковым именем. У них не модет быть написан стиль так, чтобы он затрагивал однотипные блоки по определению.
Это разные item разных блоков. Если писать стили просто на .item — будет коллизия.
.menu .menu__item .list .list__item
Это разные item разных блоков. Если писать стили просто на .item — будет коллизия.
+2
А в БАМ пишутся стили только на item? На сколько я знаю, все item пишутся в CSS как:
.block__item{
}
0
Вы спросили чем запись .block .element хуже чем .block__element. Я ответил.
+1
Нет, не ответили. Никаких коллизий не будет.
0
При таком использовании будут коллизии:
.menu .menu .item .list .list .item
+1
Стили написанные для .menu .item будут применяться и к .list .item. Это side effect. В случае применения БЭМ-нотации этого можно избежать, стили компонент не пересекаются.
+1
Понял. Спасибо.
0
А если использовать .menu.item или .menu > .item? Мне тоже не до конца понятна выгода от такого именования, хотя уверен, что она есть.
0
+1 и также это повышает специфичность селектора, что ограничивает вас в действиях — вы не сможете писать стили на сам .element без !important или без указания контекста (блока родителя .block).
0
Ну как же, у вас каскад появится, браузер будет тормозить!
0
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Видео доклада «Пишем #b_ правильно» с WebCamp 2015