十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
这篇文章主要介绍了web开发中有几种清除浮动,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
成都创新互联,为您提供成都网站建设、重庆网站制作、网站营销推广、网站开发设计,对服务成都除甲醛等多个行业拥有丰富的网站建设及推广经验。成都创新互联网站建设公司成立于2013年,提供专业网站制作报价服务,我们深知市场的竞争激烈,认真对待每位客户,为客户提供赏心悦目的作品。 与客户共同发展进步,是我们永远的责任!
子元素浮动会导致父元素盒子无法被撑开,导致父元素的样式无法显示,清除浮动的方法
原代码:
内容一
内容二
显示如下:
1、设置父元素高度:
height: 500px; /*设置父元素高度*/
内容一
内容二
2、父元素绝对定位:position:absolute;
内容一
内容二
3、父元素设置overflow:hidden
内容一
内容二
4、父元素设置浮动:float:left/right
内容一
内容二
5、在子元素最后添加一个空盒子,并设置样式为clear:both;
内容一
内容二
6、在父元素样式上添加一个伪类,相当于在子元素最后添加一个空盒子,原理与5类似
内容一
内容二
感谢你能够认真阅读完这篇文章,希望小编分享的“web开发中有几种清除浮动”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!