css bem

Block Element Modify

 

1. 使用类，不使用id选择器
2. 不使用元素选择器
3. 特殊的一些用法不依赖于block可直接命名如：.sr-only {}

 

.block__element--modify {}

 

<ul class="menu">
  <li class="menu__item"><a class="menu__link">Home</a></li>
  <li class="menu__item--active"><a class="menu__link">About</a></li>
</ul>

 

虽然有点难看。写起来也麻烦，不过语义清晰，好处多多