1

我正在开发一个大型网站。我们正在考虑以 BEM 样式编写 CSS，但不确定这是否真的是一个好习惯。CSS 都是关于继承的，但我在 BEM 中看不到这一点。例如：

.toolbar {
  &-btn {}  
}

VS

.toolbar {
  .btn {}
}

第二个示例中的 .btn 可以从全局 .btn 类继承，但 .toolbar-btn 类不会继承这些默认属性。所以你最终会写很多重复的属性。如果 BEM 不继承属性，为什么人们说它完全可以重用？编辑：我们尽量避免使用扩展功能。

4

1 回答 1

1

如果您需要定义.btn为全局类，则应将其用作修饰符（用于变体）

 .btn.btn--主要的

 // 或者
 .my-cool-btn.btn--primary.btn--red

这是谷歌新的“Material Design Lite”框架的方法

 .mdl-layout__container //父元素

 --- .mdl-layout //块

 ------ .mdl-layout__header //元素

 ------ .mdl-layout__content //元素

.mdl-layout__header以及元素上的一些修饰符

// 局部修饰符
.mdl-layout__header-row
.mdl-layout__header--滚动


// 全局修饰符
.demo 头文件
.is-casting-shadow
.mdl-color--grey-100
.mdl-color-text--grey-800

我强烈建议你看看他们的存储库 和这个模板示例

于 2015-08-07T09:20:33.590 回答