• div+css之清除浮动


    当元素有浮动属性时,会对其父元素或后面的元素产生影响,
    会出现一个布局错乱的现象,可以通过清除浮动的方法来解决浮动的影响。

    浮动的清理(clear):

    值:
    none:默认值。允许两边都可以有浮动对象;
    left:不允许左边有浮动对象;
    right:不允许右边有浮动对象;
    both:左右两侧不允许有浮动对象。

    清除浮动的方法:
    1.额外标签法
    这种方法应该是最简单的一种了,w3c建议在容器的末尾增加一个“clear:both"的元素
    强迫容器适应它的高度以便装下所有的float元素。
    <div id="main">
       <div id="left"></div>
       <div id="right"></div>
       <div class="clear"></div>
    </div>
    <div id="footer"></div>

    .clear{clear:both;}

    2.父元素添加overflow:hidden;
    注:如果子元素使用了定位布局,就会很难实现。

    3.利用伪对象after方法
    定义一个类,使用伪对象after,控制浮动元素的影响。
    网上最流行的清除浮动代码:
    .clearFix:after{
     clear:both;
     display:block;
     visibility:hidden;
     height:0;
     line-height:0;
     content:'';

    }
    .clearFix{zoom:1;} /*解决ie6/7兼容问题*/


    css溢出的使用
    设置对象的内容超过其指定高度及宽度时,如何管理内容。
    overflow:visible【默认值,不剪切内容也不添加滚动条】
    auto【在必需时,对象内容才会被剪切或添加滚动条】
    hidden【不显示超过对象尺寸的内容】
    scroll【总是显示滚动条】

    zoom属性:只有ie内核的浏览器支持,缩放比例。
    设置或检索对象的缩放比例。
    语法:normal【默认值,使用对象的实际尺寸】;number【百分数|无符号浮点实数。浮点实数
    为1.0或百分数为100%时相当于此属性的normal值
    zoom:1解决ie6高度自适应问题。

  • 相关阅读:
    多表查询
    Java基础
    group by 和 having 用法
    多态
    修改用户权限
    集成测试过程
    系统测试
    软件验收测试通过准则
    性能测试、负载测试、压力测试的区别
    白盒测试
  • 原文地址:https://www.cnblogs.com/zq20/p/4198472.html
Copyright © 2020-2023  润新知