网店系统：高效CSS代码设计技巧

随着CSS代码在网店系统中网页布局的应用越来越广泛，更多的CSSer开始书写CSS，如何才能写出高效规范的CSS代码呢，今天向大家介绍，必须要注意的七个方面：

一、使用外联样式替代行间样式或者内嵌样式

1、不推荐使用行间样式

2、不推荐使用内嵌样式

3、推荐使用外联样式

二、建议使用 link 引入外部样式表

1、为了兼容老版本的浏览器，建议使用 link 引入外部样式表的方来代替 @import导入样式的方式.

@import和link在使用上会有一些区别， 利用二者之间的差异，可以在实际运用中进行权衡。

2、不推荐@import导入方式

3、推荐引入外部样式表方式

三、使用继承

高效的CSS代码

body { font-family: arial, helvetica, sans-serif; }    

body { font-family: arial, helvetica, sans-serif; }   

h1 { font-family: georgia, times, serif; }  

四、使用多重选择器

高效的CSS代码

h1, h2, h3, h4 { color: #236799; }  

五、使用多重声明

高效的CSS代码

p { margin: 0 0 1em; background: #ddd; color: #666; }  

六、使用简记属性

高效的CSS代码

body { font: 85% arial, helvetica, sans-serif; background: url(image.gif) no-repeat 0 100%; margin: 1em 1em 0; padding: 10px; border: 1px solid red; color: #222; }  

七、避免使用 !important

慎用写法

CSS代码

#news { background: #ddd !important; }  

特定情况下可以使用以下方式提高权重级别

CSS代码

#container #news { background: #ddd; }   

body #container #news { background: #ddd; }  

网店系统 www.wqeshop.com 转载来源：中国站长网