BEM命名规范中的元素命名可以使用两种方式:
"block__element":使用双下划线将block和element连接起来,表示元素是block的一部分。例如:header__logo
, menu__item
。
"block__element block__element--modifier":在上述方式的基础上,使用双破折号和修饰符来表示元素的状态或样式的变化。例如:header__logo header__logo--big
, menu__item menu__item--active
。
以下是一个示例代码,演示如何使用BEM命名规范:
Logo
在上面的示例中,header
是一个block,logo
和menu
是block的元素。header__logo--big
和menu__item--active
是元素的修饰符,表示它们的状态或样式的变化。
使用BEM命名规范可以使代码更加清晰和可维护,同时避免了样式冲突和命名混乱的问题。
下一篇:BEM嵌套元素和悬停效果