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