float: left|right; 可以自动排列自动折行, 但需要clear来配合清除浮动;display: inline-block; 有些时候可以替代float实现相同的效果.position: absolute|relative; 要配合top,left等定位;position: absol...
分类：
Web程序 时间：
2014-10-26 16:50:09
阅读次数：
334
参考：分享：CSS深入理解之float浮动 一：float设计初衷 即是为了实现文字环绕效果 包裹：BFC（块级格式化上下文） 破坏：容器被破坏，父元素高度塌陷（标准， 二：清除浮动（带来的影响） 1：方法一，在底部插入clear：both clear:html block 水平元素底部 css a...
分类：
Web程序 时间：
2014-10-26 01:35:36
阅读次数：
165
为什么要清除浮动？非IE下，当容器的高度为auto,容器有浮动元素，此时容器的高度不能自己伸长适应内容的高度，造成内容溢出乃至影响布局，即所谓的“浮动溢出”，为防此象，需要清除浮动。如何清除浮动？这里只记录最好的一种方法,伪元素和ie 触发haslayout：.clearfix{zoom:1;}.c...
分类：
Web程序 时间：
2014-10-24 18:41:43
阅读次数：
223
什么是CSS清除浮动？在非IE浏览器（如Firefox）下，当容器的高度为auto，且容器的内容中有浮动（float为left或right）的元素，在这种情况下，容器的高度不能自动伸长以适应内容的高度，使得内容溢出到容器外面而影响（甚至破坏）布局的现象。这个现象叫浮动溢出，为了防止这个现象的出现而进...
分类：
Web程序 时间：
2014-10-23 19:12:32
阅读次数：
197
清除浮动早已是一个前端开发人员必学的一课。毫无疑问，多年来，我们已经接触过多种清除浮动的方法，现在“clearfix methods”越来越被大家熟知。在深入剖析“clearfix”的多种用法之前，我们来先看看clearfix方法试图解决哪些问题。 场景: .el-1 和.el-2是并排浮动在......
分类：
其他好文 时间：
2014-10-22 20:19:13
阅读次数：
269
......1.包含元素#wrapper {overflow:hidden;}(包含元素内的内容overflow时，无法显示)2.包含元素跟所包含的内容同时#wrapper {float:left;}(影响同包含元素同一层的元素的布局)3.包含元素#wrapper {display:table;}(...
分类：
Web程序 时间：
2014-10-18 12:33:04
阅读次数：
254
清除浮动（clear float）谈拥有布局（has layout）与块级格式化范围（block formatting context）float是网页布局中都要使用的css属性，他为我们灵活布局提供了方便，但同时浮动太多会带来很多麻烦，所以我通常的做法是使用float完后，马上清除他。float的...
分类：
其他好文 时间：
2014-10-09 14:06:53
阅读次数：
223
浮动(float)，一个我们即爱又恨的属性。爱，因为通过浮动，我们能很方便地布局； 恨，浮动之后遗留下来太多的问题需要解决，特别是IE6-7（以下无特殊说明均指 windows 平台的 IE浏览器）。也许很多人都有这样的疑问，浮动从何而来？我们为何要清除浮动？清除浮动的原理是什么？本文将一步一步地深...
分类：
其他好文 时间：
2014-09-29 11:17:57
阅读次数：
291
一、浮动产生的原因float属性具有破坏性：子元素设置float:right或float:left导致父级元素高度塌陷。二、浮动副作用1、背景不能显示由于浮动产生，如果对父级设置了（CSS background背景）CSS背景颜色或CSS背景图片，而父级不能被撑开，所以导致CSS背景不能显示。2、边...
分类：
其他好文 时间：
2014-09-25 21:36:47
阅读次数：
169
第一种情况： .content { overflow:hidden; width:100%; height:200px; border:2px dotted blue; } ...
分类：
其他好文 时间：
2014-09-25 19:04:47
阅读次数：
153
