CSS 命名规范
BEM 命名法
BEM(Block, Element, Modifier) 是由 Yandex 团队提出的一种前端命名规范. 其核心思想是将页面拆分成一个个独立的富有语义的块 (blocks), 从而使得团队在开发复杂的项目变得高效, 并且十分有利于代码复用, 即便团队引入新成员, 也容易维护.
Block 是块, 比方说 div,header, 可以嵌套复用. 更严格一点来说不能影响自身布局, 最好不要设置 margin 和 position, 也不要使用元素选择器和 ID 选择器.
Element 是元素, 比方说 input,p. 是 Block 的组成部分.
Modifier 是修饰, 定义 Block 和 Element 的外观, 状态, 或者行为. 当然这个部分并不是必须的, 可以省略.
Block 与 Element 之间通过__来连接, Element 与 Modifier 之间通过 -- 来连接
总体就是 Block__Element--Modifier
何时用 Element 何时用 Block
如果一段代码可能被重用, 并且它不依赖于页面中的其他组件, 这时就可以使用 Block, 反之就可以使用 Element.
多年编程经验, 月初整理了一批 2019 年最新 web 前端教学视频, 不论是零基础想要学习前端还是学完在工作想要提升自己, 这些资料都会给你带来帮助, 从最基础的 html+CSS+JS[炫酷特效, 游戏, 插件封装, 设计模式] 资料都有整理, 帮助所有想要学好前端的同学, 学习规划, 学习路线, 学习资料, 问题解答. 只要加入 Web 前端学习交流 qun:767,273,102 , 即可免费获取, 学习不怕从零开始, 就怕从不开始.
来源: http://www.jianshu.com/p/a602383a21b5