網(wǎng)站CSS樣式，讓企業(yè)網(wǎng)站展示更標(biāo)準(zhǔn)

珠海網(wǎng)訊互聯(lián)曾經(jīng)在一篇文章中指出，DIV+CSS的網(wǎng)站設(shè)計(jì)技術(shù)已經(jīng)成為企業(yè)網(wǎng)站建設(shè)中的一個(gè)大發(fā)展趨勢，下面讓我們的小編來繼續(xù)這個(gè)話題，教大家如何寫出高效的CSS代碼，讓企業(yè)網(wǎng)站展現(xiàn)的更標(biāo)準(zhǔn)。

首先我們來看以下兩個(gè)CSS執(zhí)行效率的對比

低效率的CSS

p{ font-family: arial, helvetica, sans-serif; }
#container { font-family: arial, helvetica, sans-serif; }
#navigation { font-family: arial, helvetica, sans-serif; }
#content { font-family: arial, helvetica, sans-serif; }
#sidebar { font-family: arial, helvetica, sans-serif; }
h1 { font-family: georgia, times, serif; }

高效的CSS

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

其次可以使用簡記屬性的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; }

還有一個(gè)注意事項(xiàng)就是盡量少的使用 !important

慎用寫法
#news { background: #ddd !important; }
特定情況下可以使用以下方式提高權(quán)重級(jí)別
#container #news { background: #ddd; }
body #container #news { background: #ddd; }

最后就是盡量使用 link 引入外部樣式表，為了對老版本瀏覽更好的提供支持，在編寫CSS代碼時(shí)盡量使用 link 引入外部樣式表的方來代替 @import導(dǎo)入樣式的方式。

@import和link在使用上會(huì)有一些區(qū)別， 利用二者之間的差異，可以在實(shí)際運(yùn)用中進(jìn)行權(quán)衡。