CSS技巧:改善代码可读性并简化代码管理
Some readers have asked to me what is the better way to organize a CSS file to optimize code readability and simplify code management. Generally, I adopt just some simple rules and, it''s my opinion, they are useful in order not to become crazy if you have to manage a CSS file for a page/site with a complex design. In this post, I discuss for simplicity a typical two columns fixed layout like this: 一些读者曾问我如何以更好的方式组织CSS文件来改善代码的可读性并简化代码的管理。一般情况下,我只采用几个简单的规则,但我认为很有用,因为当你不得不去管理一个有着复杂设计的页面/站点的CSS文件时,它可以避免让你抓狂。在这里,我将简单探讨如下所示的典型的两列固定宽度布局: Step 1: redefine HTML elements I think it''s a good rule to redefine HTML elements (body, a, form, input...) in the first rows of your CSS files. 第一步:重定义HTML标签 我认为在CSS文件前面几行重新定义HTML标签(body, a, form, input...)是一个好规则。 /* ------------------------------- */ /* HTML Elements /* ------------------------------- */ html {font-family:arial, verdana, sans serif; font-size:13px;} a:link, a:visited{color:#0033CC;} a:hover{color:#003366;} h1, h2, h3, h4, h5, h6, form, input, text-area{ border:0; padding:0; margin:0; font-family:arial, verdana, sans serif;} h1{font-size:24px; color:#000000;} h2{font-size:18px; color:#666666;} ... Step 2: define page elements |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢! |