用float对元素布局
开发工具:Dw 技术:HTML5、css
作者:陆桂超
撰写时间:2019年 1 月 18 日
1、 下面我们用float来实现一些元素的页面布局,在这里会遇到一个小问题,下图是要实现的效果。
2、 按照常规的做法,给p标签分别设置左浮动和右浮动。
3、 把HTML代码写好后,这时我们发现绿色的div没有显示出来,通过检查可以发现绿色的div是存在的,只是被p标签覆盖了,这是因为浮动带来的影响。
备注:这时绿色的div就在下图标记的位置
4、既然是浮动的影响,那么我们就要清除浮动带来的影响,做法就是给绿色的div添
加clear:both 这时就能达到我们想要的效果。代码和效果如下图所示。
用float对元素布局
最新推荐文章于 2022-04-24 10:59:34 发布