开发者社区> 问答> 正文

css中的zoom和haslayout究竟是什么意思 ?

只知道zoom:1能清除IE6浮动,不知道还有其他什么作用,另外haslayout不懂什么意思?

展开
收起
a123456678 2016-03-25 13:59:55 2593 0
1 条回答
写回答
取消 提交回答
  • zoom是一个IE的私有属性,作用在于缩放元素。目前为止,wekbit系列、ie系列(ie6~ie11)均支持。

    wekbit系列和ie系列,对于此属性上面实现不一致*,因此,在前端的实际开发中,仅仅是hack式的使用zoom,目的是为了在IE6/7中,设置元素的haslayout属性为true。

    /比如inline-block的hack/
    .ilblk { display: inline-block; display: inline; zoom:1 ; }
    当然,还有LZ所说的清理浮动功能。

    /比如clearfix实现/
    .clearfix { *zoom: 1; }
    .clearfix:after {content: "0020"; display: block; height: 0; clear: both; visibility: hidden; }
    *| zoom的大体思路是使CSS计算值乘以相应的zoom值,但设置zoom后,有些属性如margin,在IE系列下不会将计算后的值乘以zoom,但在chrome下会。

    HASLAYOUT
    就个人整理前端的相关文章而言,这一片是介绍全面且没有谬误的:hasLayout && Block Formatting Contexts。

    BFC和haslayout是CSS布局基础之一,在学习之前,最好掌握以下知识点:

    CSS三种定位体系:常规流、浮动、绝对定位
    常规流:行内元素与块级元素
    浮动:浮动与清除浮动
    (吐槽:搜索前端相关知识,经常能出现一大波垃圾站转载一些乱试属性试出来的“解决方案”,所以对于一个前端来说,能够自己阅读标准并做好相应储备是非常重要的)

    2019-07-17 19:14:11
    赞同 展开评论 打赏
问答分类:
问答标签:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
零基础CSS入门教程 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载