CSS开发规范

我们是一小队开发者,这是我们的开发规范。所谓规范和标准,一种是由性质决定的,例如代码执行效率。另一种是为人服务的,例如可读性和重用行。规范是人制定的。我们要根据实际使用规范。但是不能没有规范。所以,在开发过程中,我们也要建立自己的标准。不断更新和完善这份文档。

区块风格:选择器后一个空格,属性值前面用制表符,不要用空格。

selector {
      property: value;
      porperty: value;
}
多个选择器要换行
#selector-1,
#selector-2,
#selector-3 {
  background:#fff;
  color:#000;
}
属性之间的排列
按字母升序
#selector-1 {
    font-size: 1em;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}
一个原则(特别是属性较多的时候):“显示属性”,”自身属性“,”文本属性“
显示属性:   display、list-style、position、   float、clear
自身属性:width、height、   margin、padding、border、   background
文本属性:color、font、text-decoration、text-align、vertical-align、white-space、content

命名规则

1. 全部用英文,避免用拼音。要求易于理解,遵循习惯命名。常用命名方法下面给出。
2. 用小写字母,不要用缩写。两个单词之间用连字符-,下划线_有时候不被支持。

模块划分原则

开发的时候尽量规划一下。模块前面要有注释。大致可以分为三类
全局标签
body,html,li,font-size,font-family,h1,h2,margin等
整体框架
#header,#nav #footer,#wrapper,#comment之类的
细节(就是大块内的修饰)
例如包含在header里面的元素。
#header h1{}
#header a{}
#nav a{};#nav li{}

注释


1. 开头注释(视实际情况而定)
2. 模块前要注释。
3. 难以根据id名来理解的代码前面要注释。
4. 解决浏览器兼容性等特殊代码前面要注释。

其他原则

1. 积累代码和风格,特别是通用代码(不止一个页面使用)
2. 尽可能的通过继承和层叠重用已有样式
3. 根据新建样式的适用范围分为三级:全站级、产品级、页面级
4. 避免低效果选择器
以下规则有待验证
body > * {...}
ul > li > a {...}
#footer > h3 {...}
ul#top_blue_nav{}
#searbar span.submit a{}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值