关于float的说明

时间:2024-10-30 18:04:38

关于float的说明

   
关于float的说明
如图所示,蓝色的div和红色的div处于黑色的div(宽为500px)之中,其中蓝色的div设置了做浮动;
由图一(红色div的margin-top为10px,margin-left为200px) 知:浮动之后蓝色div脱离了正常的文档流,而紧接着蓝色div的红色div则升了上去,这个蓝色div浮动层对于红色div的影响在于红色div内容显示方面:具体说就是红色div里的内容会以蓝色div的结尾为开始显示的地方,对比图二和图三,图二红色的margin-top为75px,图三为76px;但是图二和图三的红色div的margin-left都是一样的为100px,由此可知以上结论 的正确性;浮动的影响暂时只知道有这一点。由三张图也可知红色div的属性设置皆是无视浮起的蓝色div的(如margin-left仍然以黑色的div为依据的,并未受到蓝色div的影响)【补充】float只影响周围元素的显示,其他的方面(需要计算的地方等等)都可以忽略float的元素。