码迷,mamicode.com
首页 > Web开发 > 详细

多浏览器CSS样式解决方法

时间:2014-10-18 11:01:59      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   io   os   ar   使用   for   

一、CSS HACK

1、在同一个CSS样式表中,使用 !important 来定义不同的值以适应Firefox和IE,例如:

 

#box {
     color:red !important;
     color:blue;
 }

 

 

(注意这里IE6是无法识别 !important 这个标记的,但它会识别padding: 20px,所以要在后面加上padding: 10px用来覆盖padding: 20px)

2、为特定浏览器设置特定的样式

 

height:20px; /*For all 包括火狐 */
*height:25px; /*For IE7 & IE6*/
_height:20px; /*For IE6*/
*+height:20px /* IE7 */

 

#someNode
{
    position: fixed;    /*给Firefox以及其他浏览器看 */
   #position: fixed;    /*给IE7看 */
   _position: fixed;    /*第三排给IE6以及更老的版本看*/
}

*+html 与 *html 是IE特有的标签, firefox 暂不支持。

*+html 对IE7的HACK 必须保证HTML顶部有如下声明:

XML/HTML代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 

二、float 闭合

关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup]

将以下代码加入Global CSS 中,给需要闭合的div加上 class="clearfix" 即可。

/* Clear Fix */
.clearfix:after {  
content:".";  
display:block;  
height:0;  
clear:both;  
    visibility:hidden;  
}  
.clearfix { display:inline-block;   }
/* Hide from IE Mac /*/  
.clearfix { display:block; }   
/* End hide from IE Mac */  
/* end of clearfix */

 

待补充......

多浏览器CSS样式解决方法

标签:style   blog   http   color   io   os   ar   使用   for   

原文地址:http://www.cnblogs.com/heyuheitong/p/4032636.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!