BEM命名规则和规范

BEM命名规则:http://segmentfault.com/a/1190000000391762

class命名方案:http://www.w3cplus.com/css/css-class-name.html

常用的CSS命名规范:http://www.html5cn.org/article-7600-1.html

通用CSS笔记、建议与指导:https://github.com/chadluo/CSS-Guidelines/blob/master/README.md

切勿将标记 CSS 样式的 class 用作 JavaScript 钩子。把js行为与样式混在一起将无法对其分别处理。

如果你要把js和某些标记绑定起来的话,写一个js专用的 class。简单地说就是划定一个前缀 .js- 的命名空间,例如 .js-toggle,.js-drag-and-drop。这意味着我们可以通过 class 同时绑定 JS 和 CSS 而不会因为冲突而引发麻烦。

如:<div class="is-sortable js-is-sortable"></div>

命名约定的模式如下:

.block{}

.block__element{}

.block--modifier{}

.block 代表了更高级别的抽象或组件。

.block__element 代表.block的后代,用于形成一个完整的.block的整体。

.block--modifier代表.block的不同状态或不同版本。

格式:1.先写带有浏览器私有标志的,后写W3C标准的。

2.使用16进制表示颜色值。

3.省略值为0时的单位

4.最后一个值也以分号结尾
5.根据属性的重要性按顺序书写

参考网址:http://nec.netease.com/standard

时间: 2024-10-14 08:44:54

BEM命名规则和规范的相关文章

CSS书写规范、顺序和命名规则

一.CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等) 二.CSS书写规范 1.使用CSS缩写属性 CSS有些属性是可以缩写的

CSS命名规则规范整理

转载声明:原载:彬Go本文链接:http://blog.bingo929.com/css-coding-semantic-naming.html 在此,非常感谢该文章作者的分享,本文完全转载自上面链接,此处作为备份,方便查看使用. CSS命名规则规范整理 大家在写css的时候,经常会遇到关于命名的问题.页面上成百甚至上千的class或者id,我们就会越来越感到困扰. 所以,这样我们就很有必要整理自己的一套命名规范.这里我就说说我自己的命 大家在写css的时候,经常会遇到关于命名的问题.页面上成百

《疯狂Java讲义(第3版)》.(李刚)——java命名规则及编码规范

1.命名规则: 此处借鉴一下他人的资料,比较全面一些,方便了解学习. JAVA源文件的命名 JAVA源文件名必须和源文件中所定义的类的类名相同. Package的命名 Package名的第一部分应是小写ASCII字符,并且是顶级域名之一,通常是com.edu.gov.mil.net.org或由ISO标准3166.1981定义的国家唯一标志码.Package名的后续部分由各组织内部命名规则决定,内部命名规则指定了各组件的目录名,所属部门名.项目名等. Class/Interface的命名 Clas

CSS规范 - 命名规则

使用类选择器,放弃ID选择器 ID在一个页面中的唯一性导致了如果以ID为选择器来写CSS,就无法重用. NEC特殊字符:"-"连字符 "-"在本规范中并不表示连字符的含义. 她只表示两种含义:分类前缀分隔符.扩展分隔符,详见以下具体规则. 分类的命名方法:使用单个字母+"-"为前缀 布局(grid)(.g-):模块(module)(.m-):元件(unit)(.u-):功能(function)(.f-):皮肤(skin)(.s-):状态(.z-)

网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容如下:

页头:header  如:#header{属性:属性值;}或.header{属性:属性值;},也许你需要了解class与id区别及用法登录条:loginBar         标志:logo                侧栏:sideBar广告:banner              导航:nav                 子导航:subNav菜单:menu               子菜单:subMenu      搜索:search滚动:scroll               页

AMD规范中模块id的命名规则

AMD 即 Asynchronous Module Definition, 中文是" 异步模块定义"的意思. AMD 规范制定了定义模块的规则,这样模块和模块的依赖可以被异步加载. AMD 规范只定义了一个函数且为全局变量:define(id?,dependencies?,factory) 这里我们主要整理下id的命名规则. id 一个字符串,定义的是模块的名字,这个参数是可选的.如果没有提供该参数,模块的名字应该默认为模块加载器请求的指定的脚本名字.如果提供了该参数,则必须是顶级的或

C语言编程规范—命名规则

转载自:http://www.cnblogs.com/wfwenchao/p/5209197.html C是一门朴素的语言,你使用的命名也应该这样.与Modula-2和Pascal程序员不同,C程序员不使用诸如"ThisVariableIsATemporaryCounter"这样"聪明"的名字.C程序员应该叫它"tmp",这写起来更简单,也不会更难懂.然而,当面对复杂情况时就有些棘手,给全局变量取一个描述性的名字是必要的.把一个全局函数叫做&qu

C/C++ 代码规范: 命名规则、注释、格式

摘抄精简Google 开源项目风格指南: http://zh-google-styleguide.readthedocs.org/en/latest/contents/ 一. 命名规则 永远不要使用单词缩写(如count写成cnt) 变量名: 小写字母,下划线连接,一般用名词,如error_count 类的成员变量以下划线结尾,如my_exciting_member_variable_ 结构体的数据变量,小写字母,下划线连接 全局变量,前缀g_ ,如g_global_variable 常量: 加

详解 Python 中的下划线命名规则

在 python 中,下划线命名规则往往令初学者相当 疑惑:单下划线.双下划线.双下划线还分前后……那它们的作用与使用场景 到底有何区别呢?今天 就来聊聊这个话题. 1.单下划线(_) 通常情况下,单下划线(_)会在以下3种场景中使用: 1.1 在解释器中: 在这种情况下,“_”代表交互式解释器会话中上一条执行的语句的结果.这种用法首先被标准CPython解释器采用,然后其他类型的解释器也先后采用. >>> _ Traceback (most recent call last): Fil