当元素有浮动属性时，会对其父元素或后面的元素产生影响，
会出现一个布局错乱的现象，可以通过清除浮动的方法来解决浮动的影响。
浮动的清理(clear):
值:
none:默认值。允许两边都可以有浮动对象；
left:不允许左边有浮动对象；
right:不允许右边有浮动对象；
both:左右两侧不允许有浮动对象。
清除浮动的方法：
1.额外标签法
这种方法应该是最简单的一种了，w3c建议在容器的末尾增加一个“clear:both"的元素
强迫容器适应它的高度以便装下所有的float元素。
.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高度自适应问题。
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
806
收藏
