美文网首页
浮动心得总结

浮动心得总结

作者: 正玹 | 来源:发表于2018-08-11 08:27 被阅读0次

    一、浮动的本质是为了实现文字环绕的效果;

    二、清除浮动带来的影响:        

    1. 普通浏览器 fix:after{content:'';display:table;clear;both}

    2.IE8 fix{*zoom=1 }

    三、浮动与流式布局

    1.文字环境衍生-单侧固定,浮动与单侧尺寸固定的流体布局

        https://www.imooc.com/code/2889

        width+float

        padding-left/margin-left

    2.DOM与显示位置匹配的单侧固定布局,浮动与右侧尺寸固定的流体布局

    https://www.imooc.com/code/2890

        width:100%+float

        padding-left/margin-left

        width+float+margin负值

    3.高级进化-智能自适应尺寸,浮动与两侧皆自适应的流体布局

    https://www.imooc.com/code/2888

        float

        display:table-cell     IE8+

        display:inline-block   IE7

    本文心得来自张鑫旭大师慕课网的css深入了解之float 浮动

    相关文章

      网友评论

          本文标题:浮动心得总结

          本文链接:https://www.haomeiwen.com/subject/rhkanxtx.html