CSS樣式兼容 火狐Google IE9,8,7,6 CSS定義順序
作者:佚名 時間:2014-08-13 分享到:
body {
background-color:Black;
background-color:red\9\0;
background-color:blue\0;
*background-color:navy;
_background-color:green;
}
注意點: IE9 支持 \9\0, 中間不要有空格,寫成 background-color:red \9\0;不會識別。必須 background-color:red\9\0;
IE8 支持 \0,同樣中間不要有空格。
IE6,IE7 都支持 * ,但是IE6特別還支持 下劃線_, 如果要特別針對IE6,可以加下劃線, 比如支持IE7 寫成 *background-color:navy;
僅支持IE6的寫法 _background-color:green;
定義順序: 火狐Google>IE9>IE8>IE7>IE6;
上面是針對一個 元素的一個css屬性。 如果 要整體兼容 一段CSS代碼, 就要這么寫
#Menu{
width:1005px; height:30px;background:red; margin:0px auto;
}
*html #Menu {
width:1005px; height:30px;background:navy; margin:0px auto;
}
*+html #Menu {
width:1005px; height:30px;background:gray; margin:0px auto;
}
*:first-child+html #Menu {
width:1005px; height:30px;background:gray; margin:0px auto;
}
IE7 的 *+html #Menu 和*:first-child+html #Menu 2種寫法,效果一樣,不知道有啥差別,希望網友能給出意見。
注意點: IE6,7都支持*, IE7 特別支持+號。
當然,如果不一樣的css設置 非常多, 可以針對不同瀏覽器寫css樣式, 在瀏覽器的頭部 根據不同瀏覽器來加載css。
首先默認加載通用樣式
<link rel="stylesheet" type="text/css" href="http://www.ktcbnqb.cn" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.ktcbnqb.cn" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.ktcbnqb.cn" />
<![endif]-->
還有其他瀏覽器,格式如下
<!--[if !IE]><!--> 除IE外都可識別 <!--<![endif]-->
<!--[if IE]> 所有的IE可識別 <![endif]-->
<!--[if IE 6]> 僅IE6 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上 <![endif]-->
<!--[if IE 7]> 僅IE7 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下<![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上 <![endif]-->
<!--[if IE 8]> 僅IE8 <![endif]-->
<!--[if IE 9]> 僅IE9 <![endif]-->
國內生產的一些所謂的瀏覽器,都是用的國外的內核,其中大部分是IE內核。寫代碼的時候,主要考慮IE各個版本和火狐Google。
由于目前大部分用戶還集中在XP時代,所以IE6還占據一部分市場,還停留在IE6時代。
雖然國外已經流行Windows 7 IE9,火狐 最新瀏覽器,國內真是落后幾個節拍。
IE內核瀏覽器:
世界之窗(The World)
傲游瀏覽器(Maxthon)
騰訊TT(Tencent Traveler)
愛帆瀏覽器(Avant Browser)
360安全瀏覽器(360SE)
搜狗瀏覽器(兼容模式)(Sougou Explorer)
瑞影瀏覽器(Rayying)
也有的事開源基金的內核:360極速瀏覽器