BFC和清除浮动
1.清浮动(不考虑兼容的话这一项够用了):
.clear:after{
content:'';
display:block;
clear:both;
}
兼容ie6或7 加一个
.clear{
*zoom:1; //用来触发 haslayout(IE浏览器的BFC)
}
2.BFC (一套渲染机制)
触发BFC的方式(以下任意一条就可以)
1.float的值不为none
2.overflow的值不为visible
3.display的值为table-cell、tabble-caption和inline-block之一
4.position的值不为static或则releative中的任何一个
https://www.cnblogs.com/CafeMing/p/6252286.html
BFC和清除浮动的更多相关文章
- BFC之清除浮动篇&clear
我们在日常代码生活中,或多或少会利用浮动来布局,例如导航布局,如下图所示: 但是,我们在实现的时候,经常会遇到父元素“塌陷”以及清除浮动问题.例如 <!DOCTYPE html> < ...
- BFC清除浮动
BFC 就是清除浮动 用来处理文档脱离文档流的问题 清除浮动的方法: a.父元素也添加一个浮动 产生弊端就是:margin 不能使用 b.给父元素添加一个:display:inline-block 弊 ...
- 【Web】网页清除浮动的方法
网页中,经常用浮动的div来布局,但是会出现父元素因为子元素浮动引起内部高度为0的问题,为了解决这个问题,我们需要清除浮动,下面介绍4中清除浮动的方法. 在CSS中,clear属性用户清除浮动,语法: ...
- 详说 CSS 清除浮动
转自:http://kayosite.com/remove-floating-style-in-detail.html 浮动,从诞生那天起,它就是个特别的属性——既为网页布局带来新的方法,却又随之产生 ...
- CSS给元素清除浮动影响的方法,--最全四种方法
代码实例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- CSS——浮动及应用&清除浮动
浮动(float) 1.普通流(normal flow) 这个单词很多人翻译为 文档流 , 字面翻译 普通流 或者标准流都可以. 前面我们说过,网页布局的核心,就是用CSS来摆放盒子位置.如何把盒子摆 ...
- html-css:浮动_清除浮动
1.浮动 清除浮动之前我们首先需要了解为什么要清除浮动 1. 假设我们有一个父盒子,不设置高度,其高度有内部子盒子的大小自动撑开,这样是完全可行的,因为有时候我们并不想直接固定死父盒子的大小,而是根据 ...
- CSS系列,清除浮动方法总结
在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素.在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...
- 【深入BFC】 关于CSS中float布局,清除浮动,和margin合并的原理解析,解开你心中的那些困惑!
BFC的通俗理解: Block Formatting Context(块级格式化上下文)是W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. ...
随机推荐
- JAVA学习记录(一)————JAVA中的集合类
这个图是总体的框架图,主要是两个接口Collection和Map都继承接口Iterator(Iterable),为了实现可以使用迭代器.Collection和Map类似平级关系. 1.这里我先学习下A ...
- 2. spring定时任务
1.添加命名空间 <!-- 定时注解驱动 --> <task:annotation-driven /> <!-- 进行定时任务的类,将其定义为一个bean --> ...
- AE10.0及AE10.0以上的版本调用ESRI.ArcGIS.esriSystem出现的问题
如果本地安装的是AE10.0以上,那么添加ESRI.ArcGIS.esriSystem引用时,会出现esriLicenseProductCode并不包含esriLicenseProductCodeAr ...
- PHP:自己写的mysql操作类
a{ font-weight: bold; display: block; text-align: center; color: #5887bf; font-size: 22px; } .conten ...
- leetcode答案 有效的括号(python)
def isValid(s): if s and len(s) % 2 is 0: a = {')': '(', ']': '[', '}': '{'} l = [None] for i in s: ...
- How to Build a New Habit: This is Your Strategy Guide
How to Build a New Habit: This is Your Strategy Guide by James ClearRead this on JamesClear.com Acco ...
- linux centos 磁盘清理
执行df -h 与 du -sh / 所查询到的已用容量不对应 执行xfs_fsr来清理磁盘 参考 https://www.jianshu.com/p/0ded68808123
- webstorm没有及时将改动保存到文件盘的问题
webpack经常监听不到webstorm的改动,即使手动ctrl+s了,导致无法触发编译,去google查了下,发现webstorm有一个“save write”的功能,见下图: 这选项的作用应该是 ...
- 寻找遗失的tags
现象:查询数据库,存在tags:{} 的字段,但是api查询时,不存在tags字段 日志定位Sample的init方法中对resource_metadata的扁平处理: 3.对应方法分析 在ceilo ...
- dubbo常见面试问题(二)
1.什么是Dubbo? Duubbo是一个RPC远程调用框架, 分布式服务治理框架 2.什么是Dubbo服务治理? 服务与服务之间会有很多个Url.依赖关系.负载均衡.容错.自动注册服务 3.Dubb ...