CSS hack 完全手册 ( IE5.5 IE6 IE7 IE8 FF Opera Safari…)

Posted by admin in XHTML & CSS九 24th, 2009 | 5 Comments

区别 IE5.5、IE6、IE7、IE8、w3c

1
2
3
4
5
6
7

.qq{
background:#f00;                    /* w3c IE8 IE7 IE6*/
background/*\**/:#fdd\9;           /* IE8 IE7 IE6 */       
*background:#00f;                  /* IE7 IE6 */
_background:#0f0;                  /* IE6 */
_background /**/:#ccc             /* IE5.5 */ 
}

针对Opera、Safari 、Chrome 

1
2
3

.qq { background: #000;   }                   /* IE FF */
@media all and (min-width:0px){
.qq { background: #000;   }                  /* Opera、Safari 、Chrome */

FireFox 3 Only 

1
2

.myClass { color:#666; }/* other*/ 
html>/**/body .myClass, x:-moz-any-link, x:default { color:#f00;  }/* Only FireFox 3 */

_hack 及 IE7的hack方式

Posted by admin in XHTML & CSS二 19th, 2008 | 15 Comments

使用+hack可以区别IE与其他浏览器，但部分兼容性效果特别针对IE7设置。到目前为止，IE7还不支持下划线的属性写法，因此我们可以结合上面的使用方式，增加对IE7的hack设置。

代码如下：

1
2
3
4
5

#content{
 width:200px;/*Firefox可执行*/
 +width:300px;/*IE7可执行*/
 _width:400px;/*IE6可执行*/
 }

通过以上的css hack 设置，我们能够实现分别针对IE7/IE6及Firefox三类浏览器的样式设计。

+hack

Posted by admin in XHTML & CSS二 18th, 2008 | No Comments

+号hack方法是最近流行的一种CSS hack,非常简单也容易管理，+号用于区分IE系列浏览器与其他浏览器。使用方法如下：

1
2
3
4

#content{
width:500px;
+width:480px; /*IE可执行*/
}

在相同的属性设置下，带有+号的属性只能在IE下运行，包括IE5,IE6和IE7,这样我们就可以通过这种方式去区分对待IE系列浏览器与其他浏览器。