什邡做网站

• 首页
• 关于我们
• 服务项目
  

  高端网站定制

  

  微信定制

  

  APP开发服务

  

  网络营销服务

  

  电商网站建设

  

  生物医药网站建设

  

  外贸网站建设

  

  教育培训网站建设
• 小程序开发
• 案例展示
  

  网站建设

  

  小程序

  

  电商平台

  

  APP

  

  系统平台
• 建站知识
• 联系我们

咨询热线 ：

028-86922220

    box1左浮动

浮动的影响与清除浮动

在文档流中，父元素的高度默认是被子元素撑开的，也就是子元素多高，父元素就多高。

但是子元素浮动后,因为脱离了文档流,所以子元素无法撑起父元素的高度.导致父元素高度消失.后面的元素都将会向上移动.最终导致页面布局混乱。

清除浮动方法1(针对父子元素)：

给父元素指定一个高度直接写死（不推荐）

清除浮动方法2(针对父子元素)：

给父元素开启BFC。

清除浮动方法3:清除浮动clear(针对兄弟元素)

clear可以用来清除其他浮动元素对当前元素的影响,仅仅是清除影响,清除浮动后.元素会回到其他元素浮动之前的位置

如果前面的元素是左浮动:clear:left

如果前面的元素是右浮动:clear:right

| 值 | 描述 |
| left | 在左侧不允许浮动元素。 |
| right | 在右侧不允许浮动元素。 |
| both | 在左右两侧均不允许浮动元素。(清除对元素影响最大的那个元素浮动) |
| none | 默认值。允许浮动元素出现在两侧。 |
| inherit | 规定应该从父元素继承 clear 属性的值。 |

清除浮动导致高度塌陷问题(父子元素)：

可以直接在高度塌陷的父元素的最后，添加一个空白的div,并设置clear

但是此方法会添加冗余代码.因此可使用css进行添加伪元素:

.父元素:after{
content:"";
display:block;
clear:both;
}

以上是“css浮动的特性有哪些”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！

分享至：

   

关于我们

公司简介 发展历程

服务项目

高端网站建设 小程序开发 APP开发 网络营销

建站知识

行业新闻 建站学堂 常见问题

联系我们

公司地址 人才招聘

成都 什邡



电话：028-86922220



地址：成都市太升南路288号锦天国际A幢1002号



电话：028-86922220



地址：德阳市什邡市顺河路物华南苑B区

友情链接： 食品包装设计   成都门头广告   分类目录网站   成都网站制作   成都模板网站   手机网站版本   彩乐斯   温江网站制作   不锈钢防护栏   蓬溪网站制作公司   

版权所有：青羊区美图云海设计工作室（个体工商户） 蜀ICP备2025119305号-5