Blocks, Elements and Modifiers,是一种 CSS 命名规范
Block
封装一个本身有意义的独立实体。如:
header …
Element
块的一部分,没有独立的意义,任何元素在语义上都与其块相关联。如:
header title …
Modifier
块或元素上的标志,用它们来改变外观、行为或状态。如:
disabled,highlighted,size big …
Block 和 Element 之间用双下划线
__连接
Modifier 前面用双短横线--连接
示例:
.form {}
.form__submit {}
.form__submit--disabled {}
.form--simple {}好处
- 模块化
- 结构化
- 可复用