模块化

  • 每个模块必须有一个模块名；
  • 每个模块的基本组成部分应该一致；
  • 模块的子节点类名需带上模块名（防止模块间嵌套时产生不必要的覆盖）；
  • 孙辈节点无需再带模块名。

代码如：

  1. <section class="m-detail">
  2.     <header class="m-detail-hd">
  3.         <h1 class="title">模块标题</h1>
  4.     </header>
  5.     <div class="m-detail-bd">
  6.         <p class="info">一些实际内容</p>
  7.     </div>
  8.     <footer class="m-detail-ft">
  9.         <a href="#" class="more">更多</a>
  10.     </footer>
  11. </section>

其中 .m-detail-hd, .m-detail-bd, .m-detail-ft 为可选，视具体模块情况决定是否需要抽象为这种 头，中，尾 的结构