CSS技巧：改善代码可读性并简化代码管理

作者佚名技术来源 CSS技术浏览发布时间 2012-03-04

　In order to improve code readability, I suggest to indent all elements but with some sagacities: if an element have just two-three attributes (for example #navbar), you can use a single line to declare all properties, otherwise it''s better to declare every single property in a new line (for example see #navbar li a:link, #navbar li a:visited):
第二步：重定义页面标签
　　为了改善代码可读性，我建议缩进所有标签是比较有远见的：如果一个标签只有两三个属性（如#navbar），你可以在一行内声明所有属性，否则在一行内最好只声明一个属性（如下所示的#navbar li a:link, #navbar li a:visited）

/* ------------------------------- */
/* PAGE Elements
/* ------------------------------- */
#container{width:780px; margin:0 auto;}

#topbar{width:auto; display:block; height:80px;}
#navbar{width:auto; display:block; height:24px;}

#navbar ul, #navbar ul li{padding:0; margin:0; list-style:none; float:left;}
#navbar a{color:#FFFFFF; font-weight:bold;}
#navbar a:hover{background:#777777;}
#navbar li a:link,
#navbar li a:visited {

background:#444444;
text-decoration:none;
height:24px;
line-height:24px;
display:inline;
float:left;
width:auto;
padding:0px 10px;}

#main{width:auto; display:block;}

#column_left{width:560px; margin-right:20px; float:left;}
#column_right{width:200px; float:left;}

div.spacer{clear:both; height:10px; display:block;}
#footer{width:auto; display:block; height:24px;}

#footer a{color:#666666; text-decoration:underline;}
Step 3: define custom class
　　In the final section of

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

分享到：更多

你可能对下面的文章感兴趣

上一篇: display:inline | block |inline-block下一篇: 理解(X)HTML的文档结构

关于CSS技巧：改善代码可读性并简化代码管理的所有评论

随机推荐