中文字幕理论片,69视频免费在线观看,亚洲成人app,国产1级毛片,刘涛最大尺度戏视频,欧美亚洲美女视频,2021韩国美女仙女屋vip视频

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
@import CSS影響網(wǎng)頁性能

@import CSS影響網(wǎng)頁性能  

2010-08-15 20:42:17|  分類: CSS |  標(biāo)簽:import  link  網(wǎng)頁  引入  css   |字號(hào) 訂閱

今天著手檢查一個(gè)問題,剛換的網(wǎng)頁導(dǎo)航速度很慢,點(diǎn)一下要停兩秒鐘才有所反應(yīng),顯示CPU占用率當(dāng)時(shí)達(dá)到100%。

懷疑是生成的頁面太大,影響速度,于是將頁面引用的用@import合并的一個(gè)總CSS換成實(shí)際需要的幾個(gè)小CSS,結(jié)果的確提高了響應(yīng)速度。在網(wǎng)上一查,發(fā)現(xiàn)原因:

原文地址:http://www.chinaz.com/Design/Rules/041C2R42009.html

CSS技巧:import與link的具體區(qū)別

我們知道在網(wǎng)頁中引用外部CSS有兩種方式,即:@import與link,我們也經(jīng)常聽到有人說要使用link來引入CSS更好,但是你知道為什么嗎?

link

link就是把外部CSS與網(wǎng)頁連接起來,具體形式

@import

import文字上與link的區(qū)別就是它可以把在一個(gè)CSS文件中引入其它幾個(gè)CSS文件,具體形式

為什么使用@import

大部分使用@import方式的人是因?yàn)榕f的瀏覽器是不支持@import方式的,這意味著我們可以使用@import來引入只讓現(xiàn)代瀏覽器解析的CSS樣式.

使用以下代碼可以使IE6及以下的瀏覽器無法解析該CSS(IE6以下的屬于年久失修在這里略去方法)

@import url(../style.css) screen;另一個(gè)主要的原因就是當(dāng)你的網(wǎng)頁需要引入幾個(gè)外部CSS文件時(shí).你可以使用link引入一個(gè)CSS,然后在這個(gè)CSS文件中用@import方式引入其它幾個(gè)CSS文件.這樣看起來更容易管理.

為什么使用link

使用link方式一個(gè)最主要的原因就是你可以讓用戶切換CSS樣式.現(xiàn)代瀏覽器如Firefox,Opera,Safari都支持rel=”alternate stylesheet”屬性(即可在瀏覽器上選擇不同的風(fēng)格),當(dāng)然你還可以使用Javascript使得IE也支持用戶更換樣式.

如不明白,請(qǐng)進(jìn)入這個(gè)頁面,然后在Firefox中點(diǎn)擊”查看-頁面風(fēng)格”.

@import的小毛病

如果你網(wǎng)頁head標(biāo)簽里面十分簡(jiǎn)單,只有@import屬性的話,當(dāng)用戶瀏覽的網(wǎng)速較慢時(shí),他會(huì)看到一個(gè)沒有風(fēng)格樣式的頁面,然后隨著CSS文件被下載完成才可以看到應(yīng)有的風(fēng)格.要避免這樣的問題,你需要確保head里至少有一個(gè)script或是link標(biāo)簽.

04-11更新: @import會(huì)使得CSS整體載入時(shí)間變長(zhǎng).并且在IE中會(huì)導(dǎo)致文件下載次序被更改,例如放置在@import后面的script文件會(huì)在CSS之前被下載.

詳情請(qǐng)參考http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

到底要用那種方式

就目前看來小型的網(wǎng)站還是使用link比較合適(或者說比較流行),當(dāng)然如果將來我們需要把CSS進(jìn)行模塊化管理也肯定要用到@import.

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
在html中導(dǎo)入css的方法
CSS:@import與link的具體區(qū)別
CSS 與網(wǎng)絡(luò)性能
Web測(cè)試需要了解的知識(shí)
[譯]Web設(shè)計(jì)者和開發(fā)者必備的28個(gè)Chrome插件
從微博的改版談網(wǎng)頁重構(gòu)
更多類似文章 >>
生活服務(wù)
熱點(diǎn)新聞
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服