Css清除浮动最优方式之一
清除浮动有很多种?那么你们知道现在最常用的是哪一种呢?
在企业开发中,利用伪元素清除浮动是最佳选择之一。
那么,什么是利用伪元素清除浮动呢?
相信用过Bootstrap框架开发过项目的人都知道,废话不多说,直接上代码。
.container:before,
.container:after {
display: table;
content: " ";
}
.container:after {
clear: both;
}
把产生的伪元素的display设置为table,这时候一个新的匿名的BFC(块级格式化上下文)和table-cell被创建,:before伪元素的作用是防止上边距崩塌,:after 伪元素清除浮动。
就是这么简单,赶快用起来吧
Css清除浮动最优方式之一的更多相关文章
- css清除浮动的方法汇总
这是在其他地方看到的一篇文章,汇总的不错,摘过来做个记录. 引用地址 : http://www.cnblogs.com/ForEvErNoME/p/3383539.html ------------- ...
- 什么是CSS清除浮动?
在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...
- 【转】css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?
摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响? 一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...
- css清除浮动float方法
转载:http://www.cnblogs.com/ForEvErNoME/p/3383539.html 什么是CSS清除浮动? 在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的 ...
- css清除浮动float的几种方法
摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响? 一.抛一块问题砖(display: block)先看现象: 这里我没有给最外层的DIV.outer 设置高度, ...
- CSS清除浮动方法总结
什么是CSS清除浮动? 在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高 ...
- 前端开发CSS清除浮动的方法有哪些?
在前端开发过程中,非IE浏览器下,当容器的高度自动,并且容器内容中有浮动元素(float为left或right),此时如果容器的高度不能自适应内容的高度,从而使得内容溢出破坏整体布局,这种现象叫做浮动 ...
- css清除浮动大全共8种方法
原文链接http://www.jb51.net/css/173023.html 清除浮动是每一个 web前台设计师必须掌握的机能.css清除浮动大全,共8种方法. 浮动会使当前标签产生向上浮的效果,同 ...
- DIV+CSS 清除浮动方法总结
DIV+CSS 清除浮动是页面布局中常见的问题,相信各位高手也都有自己的方法,今天在这里对常见的几种方法进行总结(PS:谈不上是原创,这里是我自己做的归纳总结,也是我自己内化的过程),希望对您能够有所 ...
随机推荐
- linux 之 tcpdump
tcpdump详细命令 -i 参数指定监听网口 -c 参数指定监听的数据包数量 -s 参数指定监听数据包大小 -w 参数指定监听数据包写入文件 如果要监听某几台主机数据包 例如10.10.10.10. ...
- WebGIS前端瓦片地图显示原理及实现
目前,有很多WebGIS开发包,ArcGIS API for JS.OpenLayers.LeafLetjs等为我们从事WebGIS开发的人封装了很多强大的功能.我们很方便的使用这些库的时候,也让我们 ...
- JS判断手机当前的系统类型
<script language="javascript"> window.onload = function () { var n = navigator.userA ...
- HTTP 返回状态代码详解
1xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代码. 100(继续)请求者应当继续提出请求. 服务器返回此代码表示已收到请求的第一部分,正在等待其余部分:101(切换协议)请求者已要求服 ...
- git merge 冲突
当前分支为 master 然后操作时: git merge dev 发现有文件冲突. 当我们倾向于使用dev 分支的代码时,可以使用以下命令: git checkout --theirs src/ma ...
- SQL动态语句 拼接SQL 并输入输出值
--动态语句语法 /****************************************************************************************** ...
- javascript 将数字(金额)转成大写
将计算好的金额转换成大写,这些功能非常多,下面我改进了一下代码(原文在这里:http://www.cnblogs.com/zsanhong/p/3509464.html). /** * _SetNum ...
- linux服务器证书安装指引
下面提供了3类服务器证书安装方法的示例: 1. Apache 2.x 证书部署 1.1 获取证书 Apache文件夹内获得证书文件 1_root_bundle.crt,2_www.domain.com ...
- iOS开发之计算文字尺寸
/** * 计算文字尺寸 * * @param text 需要计算尺寸的文字 * @param font 文字的字体 * @param maxSize 文字的最大尺寸 */ - ( ...
- 初识 Javascript.02 -- Date日期、Math对象、数据类型转换、字符串、布尔Boolean、逻辑运算符、if else 、三元表达式、代码调试方法、
Date()对象: Date对象用于处理日期和时间. 1.1 Math对象 ◆Math.ceil() 天花板函数 向上取整 只取整数,不足则进1 ◆Math.floor() 地板函数 ...