IE8 CSS hack

來源:互聯網
上載者:User
IE8正式版出來有一段日子了,但是針對ie8正式版的CSS hack卻很少,其實這是值得慶幸的,因為ie8修複了很多IE6和IE7的一些BUG,更加接近W3C標準。

針對IE8正式版的CSS hack目前可以找到的分為2種:

第一種:”\9″:

基本的寫法:

1. .test { color /*\**/ : blue \ 9 }

這個IE6、IE7、IE8都能識別;但是IE8不能識別“*”和“_”的css hack;所以我們可以這樣寫hack:(轉載

1. .header { width : 300px ;} /* 所有瀏覽器*/ 2. .header {width /*\**/ : 330px \ 9 ;} /* 所有瀏覽器IE瀏覽器 */ 3. .header {* width : 310px ;} /* IE7和IE6能識別,IE8和FF不能識別*/ 4. .header { _width : 290px ;} /* IE6能識別,IE7、IE8和FF不能識別*/

第二種:就是使用IE的條件注釋

具體可以查看這裡:http://www.css88.com/archives/705;

其他一些css hack的測試: 1. .color 1 { color : #F00 ; color /*\**/ : #00F /*\**/ } /*IE6,IE7,IE8,FF,OP,SA識別*/ 2. .color 2 { color : #F00 ; color /*\**/ : #00F /*\9**/ } /*IE7,IE8,FF,OP,SA識別*/ 3. .color 3 { color : #F00 ; color /*\**/ : #00F \ 9 } /*IE6,IE7,IE8識別*/ 4. .color 4 { color : #F00 ; color /*\**/ : #00F \ 9 } /*IE7,IE8識別*/ /*“color”和“/*\**/ ”之間有個空格*/

其中:OP表示Opera,SA表示Safari

參考閱讀:

http://ladysign-apps.com/blog/archives/529

http://webdevelop.nitamihai.com/ie8-css-hack/

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>區別IE6、IE7、IE8、FireFox的CSS hack - www.newcss.cn</title>
<style type="text/css">
<!--
#test,#note{
margin:0 auto;
text-align:center;
}
#test {
width:200px;
height:30px;
border: 1px solid #000000;
color:#fff;
line-height:30px;
}
.color{
background-color: #CC00FF; /*所有瀏覽器都會顯示為紫色*/
background-color: #FF0000\9; /*IE6、IE7、IE8會顯示紅色*/
*background-color: #0066FF; /*IE6、IE7會變為藍色*/  
_background-color: #009933; /*IE6會變為綠色*/
}
-->
</style>
</head>

<body>
<div id="test" class="color">測試方塊 hi.baidu.com/dpxdqx </div>
<div id="note">
<strong style="color:#009933">IE6</strong>
<strong style="color:#0066FF">IE7</strong>
<strong style="color:#FF0000">IE8</strong>
<strong style="color:#CC00FF">FireFox</strong>
</div>
</body>
</html>

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.