武林網(wǎng)(www.companysz.com)文章簡(jiǎn)介:在CSS 框架和模板出現(xiàn)以后,一些布局的問(wèn)題可以很容易解決掉,但是顯然這不能解決全部問(wèn)題。這些問(wèn)題通??梢酝ㄟ^(guò)普通的CSS來(lái)解決,但是有時(shí)候只針對(duì)IE顯示一些(樣式)信息可能會(huì)更好。
原文:?p=6572
譯自:
版權(quán)所有,轉(zhuǎn)載請(qǐng)注明出處,謝謝。
或許你知道,Internet Explorer 6 已經(jīng)不是最先進(jìn)的瀏覽器了。事實(shí)上,它已經(jīng)八歲了,但是很多人還在使用這個(gè)不安全的瀏覽器。正因?yàn)槿绱耍?u>網(wǎng)頁(yè)設(shè)計(jì)師不得不額外擔(dān)心他們的網(wǎng)站在IE6下的表現(xiàn)。
在CSS 框架和模板出現(xiàn)以后,一些布局的問(wèn)題可以很容易解決掉,但是顯然這不能解決全部問(wèn)題。這些問(wèn)題通??梢酝ㄟ^(guò)普通的CSS來(lái)解決,但是有時(shí)候只針對(duì)IE顯示一些(樣式)信息可能會(huì)更好。
這是用條件注釋是可以實(shí)現(xiàn)的。條件注釋只支持Windows系統(tǒng)中的IE瀏覽器。通過(guò)這些技巧,我們可以為基于Windows的IE5、6、7、8添加一些特殊的行為。這樣做的好處是,HTML和CSS代碼可以通過(guò)驗(yàn)證。
條件注釋的格式
所有可用的條件注釋標(biāo)簽是基于相同的原理的。這些條件注釋可用于所有的IE瀏覽器版本。
<!--[if IE]>
如果用戶使用IE瀏覽器,這里的信息會(huì)生效。
<![endif]-->
根據(jù)情況不同,你需要添加一個(gè)瀏覽器版本號(hào)。比如,或許你想讓IE5.5使用一個(gè)不同的樣式表:
<!--[if IE 5.5]>
<link rel="stylesheet" href="css/ie5.css" type="text/css" media="screen, projection" />
<![endif]-->
或者只針對(duì)IE7:
<!--[if IE 7]>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen, projection" />
<![endif]-->
你已經(jīng)掌握了要領(lǐng)了,是吧?
我們還能用條件注釋做什么?
微軟同樣為這些條件注釋添加了一些參數(shù)。比如,我們可以使用高于或等于某個(gè)版本、低于或等于某個(gè)版本。添加這些的確很方便。
比如說(shuō),我們要給IE7以及以下的瀏覽器添加一個(gè)不同的樣式表,我們可以這樣做:
<!--[if lte IE 7]>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen, projection" />
<![endif]-->
或者我們想為IE6以上的瀏覽器創(chuàng)建一個(gè)不同的樣式表:
<!--[if gte IE 6]>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen, projection" />
<![endif]-->
我們可以在我們的條件注釋中使用以下參數(shù):
使用條件注釋讓用戶升級(jí)他們的過(guò)時(shí)的瀏覽器
我通常不使用條件注釋來(lái)修正瀏覽器bug。我使用他們的方法是告訴人們,他們使用的是一個(gè)過(guò)時(shí)的瀏覽器。在此類(lèi)信息里面,我告訴他們,為了安全和更多功能,他們應(yīng)該升級(jí)他們的瀏覽器。
<!--[if lt IE 7]>
<p class="error">警告!您正在使用一款過(guò)時(shí)的瀏覽器。這個(gè)版本的瀏覽器功能比較簡(jiǎn)單而且不夠<strong>安全</strong>。請(qǐng)升級(jí)您的瀏覽器到<a href="" href="">下載FireFox</a> 或 <a href="Internet'>">
Internet Explorer 7+.</p>
<![endif]-->
通過(guò)這種方法,在用戶看到這條消息的時(shí)候,你可以告訴用戶,他們不應(yīng)該使用這個(gè)版本的瀏覽器,然后他們就可能升級(jí)到一個(gè)更先進(jìn)的瀏覽器。
正如你看到的這樣,你可以在你的網(wǎng)站中使用這些條件注釋的好處。
前幾天前端觀察發(fā)表了一系列的 條件CSS 的用法,那些用法是基于這個(gè)條件注釋的擴(kuò)展用法。當(dāng)然這種條件注釋的用法比較簡(jiǎn)單方便,但是 使用條件css 可以實(shí)現(xiàn)更高級(jí)的功能。請(qǐng)注意,本文所講的條件注釋可以直接在HTML代碼中使用,而條件CSS需要配合程序?qū)崿F(xiàn)。——神飛
新聞熱點(diǎn)
疑難解答
圖片精選