ie6浏览器兼容问题 CSS浮动原理及清除浮动方法(2)

.clearfix:after{
   content:".";/*加一段内容*/
   display:block;/*让生成的元素以块级元素显示，占满剩余空间*/
   height:0;/*避免生成的内容破坏原有布局高度*/
   clear:both;/*清除浮动*/
   visibility:hidden;/*让生成的内容不可见*/
  }
  .clearfix{zoom:1;/*为IE6，7的兼容性设置*/}

??需要注意的东西：

after伪类： 元素内部末尾添加内容；

?? ?? :after{content"添加的内容";} IE6，7下不兼容

zoom 缩放??

?? ?? a、触发 IE下 haslayout，使元素根据自身内容计算宽高。

?? ?? b、FF 不支持；

??【拓展】

zoom:1;属性是IE浏览器的专有属性，Firefox等其它浏览器不支持。它可以设置或检索对象的缩放比例。除此之外，它还有其他一些小作用，比如触发ie的hasLayout属性，清除浮动、清除margin的重叠等。ie6浏览器兼容问题ie6浏览器兼容问题

但很遗憾的是，它通不过W3C验证

?? ?? ?? ?? ?? ??zoom属性是IE浏览器的专有属性， 它可以设置或检索对象的缩放比例。

在平常的css编写过程中，zoom:1能够比较神奇地解决ie下比较奇葩的bug。

譬如外边距（margin）的重叠，譬如浮动的清除，譬如触发ie的 haslayout属性等等

Zoom属是IE浏览器的专有属性，火狐和老版本的webkit核心的浏览器都不支持这个属性。

然而，zoom现在已经被逐步标准化，出现在 CSS 3.0 规范草案中，也就是CSS3中的transform: scale这个属性来实现

用法：ie下子元素浮动时候父元素不随着自动扩大的问题，使用下面的CSS写法

.父元素 {   overflow: auto; zoom: 1   }

【拓展】

??关于zoom:1;和IE的hasLayout属性我在后面文章里做了介绍

.

有关CSS浮动原理及清除浮动方法的文章就介绍到这儿，文章来自网络，请大家参考。

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-64736-2.html