微信小程序开发之清除浮动坍塌两种方式
本文共 420 字，大约阅读时间需要 1 分钟。
浮动：不属于正常的流布局，通过设置float属性，浮动框可以向左或向右移动，直到其外边缘碰到包含框或另一个浮动框为止。
浮动坍塌：浮动框没有被包含进父元素中
显示如下：其他元素 浮动框
原因分析：浮动区域在它当前位置向左浮动，直到父元素框，其他文本绕过。浮动元素不在普通流中，导致父元素忽略浮动元素高度，形成坍塌。
解决方式：
1、添加高度为0的元素清除浮动
2、利用为属性在后边插入一个元素清除浮动其他元素 浮动框
其他元素 浮动框
.test::after{display: block;height: 0;clear: both;content: ''} 正常显示：
你可能感兴趣的文章
k8s 开船记：升级为豪华邮轮（高可用集群）与遇到奇怪故障（dns解析异常）
查看>>
Android使用Handler造成内存泄露的分析及解决方法
查看>>
Hash算法解决冲突的四种方法
查看>>
无法识别的属性“targetFramework”的解决方法
查看>>
[问题解决]NotImplementedError 错误原因：子类没有实现父类要求一定要实现的接口
查看>>
React中跨域问题的完美解决方案
查看>>
redis Could not connect to Redis at 127.0.0.1:6379: Connection refused 问题解决
查看>>
HTML`CSS_网站页面不同浏览器兼容性问题解决
查看>>
[微信] 微信商户号 资金解决方案 自动提现 关闭
查看>>
eclipse导入项目后出现红色叉号的解决方案
查看>>
Warning: Illegal string offset ‘account‘ in 解决方法
查看>>
解决NPM无法安装任何包的解决方案（npm ERR! code MODULE_NOT_FOUND）
查看>>
c#关于JWT跨域身份验证解决方案
查看>>
win10_x64更新错误解决: 安装一些更新时出现问题，但我们稍后会重试。如果持续出现这些问题，并且你想要搜索Web或联系支持人员以获取相关信息，以下信息可能会对你有帮助：
查看>>
解决异方差问题--加权最小二乘法
查看>>
Eclipse在高分屏下图标过小的解决方法
查看>>
c3p0：Connections could not be acquired from the underlying database!解决方案
查看>>
js中报错“Maximum call stack size exceeded“解决方法
查看>>
Spark应用程序第三方jar文件依赖解决方案
查看>>
springboot启动总是启动不起来UnsatisfiedDependencyException异常
查看>>