为了避免命名冲突,命名规则如下:

  • 公共组件因为高度重用,,命名从简,不要加前缀。
  • 各栏目的相应代码,需加前缀,前缀为工程师姓名拼音的首字母,例如:海子前缀为“hz_”,分隔符为下划线"_",例如:“hz_imgList”。
  • 模块组件化,组建中的class或id名采用骆驼命名法和下划线相结合的方式,单词之间的分隔靠大写字母分开,从属关系靠下划线分隔。

html:

<ul class="textList">

<li class="textList_firstItem">xxxxxxxxxxx</li>

<li>xxxxxxxxxx</li>

</ul>

CSS:

.textList { }

.textList_firstItem { }


  • 命名清晰,不怕命名长,怕命名容易冲突,长命名可以保证不会产生冲突,所以CSS选择时可以尽量不使用子选择符,也能确保CSS优先权重足够低,方便扩展时的覆盖操作。

.textList_firstItem { }


  • 命名要有意义,不要使用没有意义的命名,尽量用英语命名,不要用拼音。

瞬间从IT屌丝变大神——命名规则的更多相关文章

  1. 瞬间从IT屌丝变大神——注释规则

    注释的主要规则如下: 公共组件和各栏目的维护者都需要在文件头部加上注释说明: /** *文件用途说明 *作者姓名 *联系方式*制作日期 **/ 大的模块注释方法: //======= //代码用途 / ...

  2. 瞬间从IT屌丝变大神——JavaScript规范

    JavaScript规范主要包含以下内容: 底层JavaScript库采用YUI 2.8.0. 统一头部中只载入YUI load组件,其它组件都通过loader对象加载. JavaScript尽量避免 ...

  3. 瞬间从IT屌丝变大神——CSS规范

    CSS规范主要包括以下内容: CSS Reset用YUI的CSS Reset. CSS采用CSSReset+common.css+app.css的形式. app.css采用分工制,一个前端工程师负责一 ...

  4. 瞬间从IT屌丝变大神——HTML规范

    HTML规范包含以下内容: DTD统一用<!DOCTYPE HTML PUBLIC "_//W3C//DTD XHTML 1.0 Transitional//EN"" ...

  5. 瞬间从IT屌丝变大神——分工安排

    分工安排主要包含以下内容: 公共组件(包括common.css和common.js)一人维护,各子频道专人负责,每个频道正常情况下由一人负责,要详细写明注释,如多人合作,维护的人员注意添加注释信息,具 ...

  6. 7天教你精通变大神,学CAD关键还要掌握方法,纯干货新手要看

    接触CAD初期是“痛苦”的,“煎熬”的,也是充满“成就”的. 痛苦是初学者怎么都不懂,需要学习的东西很多,整个过程是有些痛苦的. 煎熬也是每个求学阶段都会遇到的状态,眼睛会了,手不会,这个状态很难受. ...

  7. 极简Node教程-七天从小白变大神(一:你需要Express)

    如果说用一句话来概括Node那就是:它开启了JavaScript服务器端语言. Node系列的文章并不会从一开始长篇概论的讲Node的历史,安装,以及其他很琐碎的事情.只会专门介绍关于Node或者准确 ...

  8. mui初级入门教程(四)— 再谈webview,从小白变“大神”!

    文章来源:小青年原创发布时间:2016-06-05关键词:mui,html5+,webview转载需标注本文原始地址: http://zhaomenghuan.github.io/#!/blog/20 ...

  9. 【同行说技术】Python程序员小白变大神必读资料汇总( 三)

    在文章<Python开发.调试.爬虫类工具大全>里面向大家总结了各种实用工具和爬虫技术,今天小编收集了5篇带有实例干货的资料,赶紧来看看吧!另外,喜欢写博客的博主可以申请加工程师博主交流群 ...

随机推荐

  1. 汇编debug 截图

  2. Shell最多支持多少个参数

    本文转自:http://www.jb51.net/article/56548.htm   这篇文章主要介绍了Shell最多支持多少个参数?本文是对Shell最多可以输入多少个参数的一篇测试文章,需要的 ...

  3. 10、JPA_映射双向多对多的关联关系

    双向多对多的关联关系 双向多对多的关联关系(抽象成A-B)具体体现:A中有B的集合的引用,同时B中也有对A的集合的引用.A.B两个实体对应的数据表靠一张中间表来建立连接关系. 同时我们还知道,双向多对 ...

  4. 区分int a() 和 int a

    事因 #include <iostream> using namespace std; struct A { A(int) {} A() {} void fun() {}; }; int ...

  5. openfire 介绍安装使用

    Openfire 采用Java开发,开源的实时协作(RTC)服务器基于XMPP(Jabber)协议.Openfire安装和使用都非常简单,并利用Web进行管理.单台服务器可支持上万并发用户.您可以使用 ...

  6. Checked&Unchecked Exception

    Java 中定义了两类异常: 1) Checked exception: 这类异常都是Exception的子类 .异常的向上抛出机制进行处理,如果子类可能产生A异常,那么在父类中也必须throws A ...

  7. .net 生成拼音码与五笔码

    首先加入配置文件: <?xml version="1.0" encoding="utf-8" ?> <CodeConfig> <S ...

  8. Android手机开机自动启动

    package com.example.x_yp.system_camera; import android.content.BroadcastReceiver; import android.con ...

  9. vpn局域网共享

    vpn局域网共享 更改网关为vpn共享主机地址 在“命令运行符”处,挨个键入下列命令,并回车生效: regsvr32 Softpub.dll regsvr32 Wintrust.dll regsvr3 ...

  10. jquery在线教程

    http://www.runoob.com/jquery/jquery-slide.htmlhttp://www.w3school.com.cn/jquery/http://www.phpstudy. ...