zoukankan      html  css  js  c++  java
  • BEM规范

    B(block)

    块是指页面中的相对独立的模块或是组件,比如header是一个block,其中的输入框也是一个block,block之间可以进行嵌套

    BEM中如果存在多个单词的情况,都使用中线-连接。

    E(element)

    指块中的子元素,比如header的标题和内容,需要使用父级block命名作为前缀,同时使用双下划线__进行连接。如:header__title。

    如果存在子元素嵌套的情况,那么被嵌套的子元素的也被视为block的直接子元素。

    例:

    <dl class="header">
      <dt class="header__title">
        大标题
      </dt>
      <dd class="header__desc">
        内容
      </dd>
    </dl>

    M(modifier)

    修饰器可以理解为一个待定的状态,与E使用双中线--连接

    通常我们在编写组件的时候使用抽象的方法解决复用的问题,例如按钮的尺寸、大小、颜色都是这类状态。

    <dl class="header">
      <dt class="header__title">
        大标题
      <button class="header__login-button header__login-button__active"/>
      </dt>
    </dl>
  • 相关阅读:
    大工程(bzoj 3611)
    消耗战(bzoj 2286)
    Computer(hdu 2196)
    文件排版(codevs 1300)
    洛谷 P2015 二叉苹果树
    洛谷 P2014 选课
    洛谷 P1352 没有上司的舞会
    COGS 505. 城市
    洛谷 P1306 斐波那契公约数
    洛谷 P1962 斐波那契数列
  • 原文地址:https://www.cnblogs.com/yanze/p/12356360.html
Copyright © 2011-2022 走看看