BEM 是否有区分状态选择器和 sub-class 选择器的约定?
Is there a convention for BEM to distinguishing state selectors from sub-class selectors?
子类化示例:
<button class="button button--large">
状态示例:
<button class="button button--open">
两者意义不同。但是,我找不到任何 BEM 约定,这会有所区别,它们都将被写为修饰符。
我知道其他可能对状态执行类似操作的方法:
<button class="button is-open">
或
<button class="button is-button-open">
BEM 中没有关于状态修饰符的官方规则。
但是……BEM 在很大程度上受到了开发人员以前使用的方法的影响,例如 SMACSS。 SMACSS 有一个关于如何编写 state classes 的指南,在你的情况下它将是 .is-open
.
我认识的开发人员按照以下模式在 BEM 中编写状态 classes:.[block]--is-[state]
.
它仍然是一个有效的 BEM 修饰符 class,并且很容易与用于静态样式组合的修饰符区分开来。
子类化示例:
<button class="button button--large">
状态示例:
<button class="button button--open">
两者意义不同。但是,我找不到任何 BEM 约定,这会有所区别,它们都将被写为修饰符。
我知道其他可能对状态执行类似操作的方法:
<button class="button is-open">
或
<button class="button is-button-open">
BEM 中没有关于状态修饰符的官方规则。
但是……BEM 在很大程度上受到了开发人员以前使用的方法的影响,例如 SMACSS。 SMACSS 有一个关于如何编写 state classes 的指南,在你的情况下它将是 .is-open
.
我认识的开发人员按照以下模式在 BEM 中编写状态 classes:.[block]--is-[state]
.
它仍然是一个有效的 BEM 修饰符 class,并且很容易与用于静态样式组合的修饰符区分开来。