CSS命名规范和CSS书写规范及方法
作者 佚名技术
来源 CSS技术
浏览
发布时间 2012-02-26
刚可以缩写为: #mainMenu,#subMenu { background:url(../images/bg.gif); border:1px solid #333; width:100%; overflow:hidden; } #mainMenu {height:30px;} #subMenu {height:20px;} 2、同一属性的缩写: 同一属性根据它的属性值也可以进行简写,如: .search { background-color:#333; background-image:url(../images/icon.gif); background-repeat: no-repeat; background-position:50% 50%; } .search { background:#333 url(../images/icon.gif) no-repeat 50% 50%; } 3、内外侧边框的缩写: 在CSS中关于内外侧边框的距离是按照上、右、下、左的顺序来排列的,当这四个属性值不同时也可直接缩写,如: .btn { margin-top:10px; margin-right:8px; margin-bottom:12px; margin-left:5px; padding-top:10px; padding-right:8px; padding-bottom:12px; padding-left:8px; } 则可缩写为: .btn { Margin:10px 8px 12px 5px; Padding:10px 8px 12px 5px; } 而如果当上边与下边、左边与右边的边框属性值相同时,则属性值可以直接缩写为两个,如: .btn { margin-top:10px; margin-right:5px; margin-bottom:10px; margin-left:5px; } 缩写为: .btn {margin:10px 5px;} 而当上下左右四个边框的属性值都相同时,则可以直接缩写成一个,如: .btn { margin-top:10px; margin-right:10px; margin-bottom:10px; margin-left:10px; } 缩写为: .btn{margin:10px;} 4、颜色值的缩写: 当RGB三个颜色值数值相同时,可缩写颜色值代码。如: .menu { color:#ff3333;} 可缩写为: .menu {color:#f33;} 四.hack书写规范 因为不同浏览器对W3C标准的支持不一样,各个浏览器对于页面的解释呈视也不尽相同,比如IE在很多情况下就与FF存在3px的差距,对于这些差异性,就需要利用css 的hack来进行调整,当然在没有必要的情况下,最好不要写hack来进行调整,避免因为hack而导致页面出现问题。 1、 IE6、IE7、Firefox之间的兼容写法: 写法一: IE都能识别*;标准浏览器(如FF)不能识别*; IE6能识别*,但不能识别 !important, IE7能识别*,也能识别!important; FF不能识别*,但能识别!important; 根据上述表达,同一类/ID下的CSS hack可写为: .searchInput { background-color:#333;/*三者皆可*/ *background-color:#666 !important; /*仅IE7*/ *backgrou |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢! |
你可能对下面的文章感兴趣
关于CSS命名规范和CSS书写规范及方法的所有评论