|
|
|
|
|
|
贊助商
分類目錄
贊助商
最新文章
搜索
IE7/IE8/IE9/IE11 CSS hack 寫法
作者:admin 時(shí)間:2016-10-17 7:24:9 瀏覽:IE7、IE8、IE9、IE11雖然同屬IE家族，但他們?cè)诰W(wǎng)頁(yè)渲染時(shí)，對(duì)css屬性的識(shí)別卻不盡相同，因此，我們會(huì)發(fā)現(xiàn)網(wǎng)頁(yè)在IE9瀏覽好好的，卻在IE11上瀏覽時(shí)出現(xiàn)錯(cuò)亂的問(wèn)題。作為一名合格的網(wǎng)頁(yè)設(shè)計(jì)者，應(yīng)該考慮到各瀏覽器兼容的問(wèn)題，因此，瀏覽器兼容性調(diào)試的工作是不能不做的。本文將舉例介紹IE家族IE7、IE8、IE9、IE11的css hack的問(wèn)題，了解它們之間的差異，從而能夠?qū)懗黾嫒菪粤己玫腸ss樣式代碼。
如何hack IE7/IE8/IE9/IE11 CSS
我們先看下面這段HTML代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Language" content="zh-CN" />
<meta http-equiv="Cache-Control" content="no-transform " />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes" />
<title>hack IE7/IE8/IE9/IE11_css實(shí)例_卡卡網(wǎng) webkaka.com</title>
<style type="text/css">
.content_ie7{
*background-color:#000000; /* black ie7 ie11 */
/* 或 */
#background-color:#000000; /* black ie7 ie11 */
}
.content{
width:200px;height:50px;color:#ccc;
background-color:#FF0000; /* red default */
background-color:#FFFF00\9; /* yellow ie8 ie9 ie11 */
background-color:#0000FF\0; /* blue ie8 ie9 */
}
</style>
</head>
<body>
<div class="content_ie7 content">hack IE7 IE8 IE9 IE11</div>
</body>
</html>
分別用 IE7 IE8 IE9 IE11 瀏覽器打開(kāi)網(wǎng)頁(yè)，會(huì)發(fā)現(xiàn)顯示的背景顏色（background-color）各不相同。分別如下：
IE7 #000000 （黑色black ▇）
IE8 #0000FF （藍(lán)色blue ▇）
IE9 #0000FF （藍(lán)色blue ▇）
IE11 #FFFF00 （黃色yellow ▇）
其他瀏覽器如Chrome、Firefox、360會(huì)顯示 #FF0000 （紅色red ▇）
上述實(shí)例css代碼是我經(jīng)過(guò)反復(fù)調(diào)試而得出的兼容性寫法。經(jīng)過(guò)此實(shí)例，可以看出 IE7、IE8、IE9、IE11 解析CSS的不同之處。概括如下：
- * 或 # ，IE7、IE11 支持。
- \9 ，IE8、IE9、IE11 支持。
- \0 ，IE8、IE9 支持。
- *、#、\9、\0 這幾個(gè)寫法除了IE外其他瀏覽器均不支持。
本文通過(guò)了一個(gè)實(shí)例介紹 IE7/IE8/IE9/IE11 CSS hack 的寫法，其實(shí)，這只是其中的一個(gè)寫法，對(duì)于IE家族，css hack還有其他的寫法，可以看看之前曾詳細(xì)介紹過(guò)的IE6\7\8\9\10\11瀏覽器的CSS hack大全。
本文實(shí)例演示及源碼下載
您可能對(duì)以下文章也感興趣
標(biāo)簽: hack
- 站長(zhǎng)推薦
