zoukankan      html  css  js  c++  java
  • 我使用的Bem的习惯

    在基于BEM命名思想的基础上,我整理一些实用的点:

    BEM,B即block(块),E即element(元素),M即modifier(修饰符)

    块:最顶层,可包含块和元素

    元素:被块包含,通常为最终被包含项,即无子代,当然,也有例外,它有时也会包含其他,如:

    <div class="media">
      <img src="logo.png" alt="Foo Corp logo" class="media__img--rev">
      <div class="media__body">
        <h3 class="alpha">Welcome to Foo Corp</h3>
        <p class="lede">Foo Corp is the best, seriously!</p>
      </div>
    </div>

    应注意的,它内部的东西class单独命名,最好不要有层级关系

    修饰符:可修饰块和元素,表示一种状态

    注意,不是所有时候都用BEM,当你觉得一个DOM结构符合使用BEM的条件时,你就可以用

    完整的class名结构如下:

    block-name__element-name--modifier

  • 相关阅读:
    11月28日总结
    12月06日总结
    12月02日总结
    11月26日总结
    12月05日总结
    11月30日总结
    软件设计职责链模式
    软件设计策略模式
    软件设计组合模式
    大数据竞赛练习题二
  • 原文地址:https://www.cnblogs.com/ww01/p/9988142.html
Copyright © 2011-2022 走看看