float---浮动带来的影响与清除浮动带来的影响方法----在路上(20)

2023-05-11,,

使用float会带来哪些影响

脱标:无行级块级之分;
相互贴靠:若想之间有空隙可用margin与padding;
顶边对齐;
文字环绕;

当使用float后,子标签脱离父标签,父标签就会失去高度,此时光标上移,父标签下面的内容就会上升,影响布局,因此:

如何清除浮动带来的影响:

设高法;给父标签设置高度;
clear:both;给不想受影响的标签设置;
overflow:hidden;内墙法,隐藏超出部分,谁想浮动就给自己加一个overflow;
clearfix;before 与after;

这里注意:在内墙法中,如想给子标签与父标签之间有距离,就子标签中设置margin,父标签中设置overflow:hidden;

clear fix中应有的内容:

content:“”;
display:block;

clear:both;

height:0;
visibility:hidden;
*zoom'1:为了兼容IE6、7

float---浮动带来的影响与清除浮动带来的影响方法----在路上(20)的相关教程结束。

《float---浮动带来的影响与清除浮动带来的影响方法----在路上(20).doc》

下载本文的Word格式文档,以方便收藏与打印。