编写高质量的CSS代码,规范建议

id和class的命名在保持语义性的同时尽可能的短.
不推荐的写法:#navigation {} .atr {}
推荐的写法 : #nav {} .author {}
可以缩写单词,但缩写后务必能让人明白其含义。比如author缩写成atr就非常费解。
参考链接: http://www.36ria.com/5249

属性书写顺序,首先定义显示属性
推荐的写法 :.selector{float:left;width:300px;height:200px; font-size:14px;color:#f36;}
不推荐的写法:.selector{font-size:14px; color:#f36; float:left; width:300px; height:200px;}
这样,就可以从CSS 规则中靠前的定义获得显示版式。 框架为先,细节次之比如写一个浮动容器的样式,我们应该先让这个容器的框架被渲染出来,让大家看到基本的网站框架。然后再再去渲染容器里面的内容。最终呈现给用户. 通常像 color font padding 之类的,写在后面。
参考链接:
http://www.qianduan.net/css-code-readable-tips.html
http://code.google.com/p/mappn/issues/detail?id=1
http://aliceui.com/css-spec/

属性书写顺序,有因才有果
不推荐的写法: span{ margin-bottom:10px; display:block; }
推荐的写法 : span{ display:block; margin-bottom:10px; }
如果想让一个 span 使用 margin, 那么我们应该这样写:span{display:block;margin-bottom:10px;} 而非 span{margin-bottom:10px;display:block;}。因为没有 display 之前,行内元素是没有 margin 的。
参考链接:http://aliceui.com

转载于:https://www.cnblogs.com/Format2012/archive/2012/06/15/2551368.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值