方法C:@import
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Applying CSS</title> <style type="text/css"> <![CDATA[ @import "styles.css"; ]]> </style> </head>
與方法B類似,使用@import能以相對路徑(像是上面的例子)或絕對路徑從外部文件導(dǎo)入CSS定義.
方法C與使用<link>標簽有著相同優(yōu)點,由于樣式表放在外部文檔中,修改并更新單一文檔就能改變整個網(wǎng)站,而且能簡單快速地完成.外部樣式表會被瀏覽器緩存下來,為導(dǎo)入相同樣式表的所有頁面節(jié)省下載時間.
捉迷藏
使用方法C的重大好處是:Netscape 4.X以下版本并不支持@import語法,因此會使被引用的CSS內(nèi)容"藏起來",這肯定是個好用的技巧,因為我們能以此編寫進階CSS語法處理布局之類的設(shè)計細節(jié),讓能夠處理的最新瀏覽器顯示它們,同時也能讓老舊瀏覽器忽視這些語法.
Netscape 4.x的問題在于:它認為它的CSS支持能力與真正支持的瀏覽器一樣好.因此,除了Netscape 4.x之外,我們都能讓瀏覽器自己決定是否顯示正確的效果.
這是以標準設(shè)計網(wǎng)站時的重點,盡量把結(jié)構(gòu)化標記代碼與顯示方式分開,并且為支持的瀏覽器提供布局細節(jié),其他樣式.老舊的瀏覽器則去他們能輕易讀取,顯示的結(jié)構(gòu)內(nèi)容,但不會處理為他們隱藏起來的進階CSS規(guī)則.
打開樣式,關(guān)閉樣式
看看圖10-1和10-2,并且比較一下,這是我的個人網(wǎng)站使用完整CSS,接著關(guān)掉CSS的顯示效果(應(yīng)該十分接近老舊瀏覽器的顯示效果),不使用CSS時的結(jié)構(gòu)仍然十分明顯,所有人仍然容易閱讀,使用.如果我們沒有把顯示布局需要的CSS隱藏起來,那么舊版本瀏覽器的使用者或許就會拿到一團難以閱讀的內(nèi)容.
圖10-1 我的個人網(wǎng)站,使用CSS
圖10-2 同一個頁面,拿掉CSS,古舊瀏覽器可能把它顯示成這樣
出處:藍色理想
責(zé)任編輯:bluehearts
上一頁 標記語言——應(yīng)用CSS [1] 下一頁 標記語言——應(yīng)用CSS [3]
◎進入論壇網(wǎng)頁制作、WEB標準化版塊參加討論,我還想發(fā)表評論。
|