css中的负边距(negative margin)是布局中的一个常用技巧，只要运用得合理常常会有意想不到的效果。很多特殊的css布局方法都依赖于负边距，所以掌握它的用法对于前端的同学来说，那是必须的。本文非常基础，老鸟可以略过。负边距在普通文档流中的作用和效果那些没有脱离文档流的元素（指不是浮动元素...
分类：
Web程序 时间：
2015-05-21 23:55:42
阅读次数：
187
一个非浮动的外围元素内，如果包含若干个浮动元素，且这些浮动元素的高度超过包围它的外围元素内的其它内容就会出现这些浮动元素溢出的情况，如下图的情况：在该外围元素关闭前，比如：在前添加，然后设置.clear{clear:both}将该外围元素也设为浮动，添加div{float:left/right;}，...
分类：
其他好文 时间：
2015-05-20 18:18:43
阅读次数：
110
float 属性定义元素在哪个方向浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。注释：假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。请看下图，当把框 1 向右...
分类：
Web程序 时间：
2015-05-17 21:43:59
阅读次数：
104
1.页面标准文档流、浮动层、float属性1.1 文档流HTML页面的标准文档流(默认布局)是：从上到下，从左到右，遇块(块级元素)换行。1.2 浮动层浮动层：给元素的float属性赋值后，就是脱离文档流，进行左右浮动，紧贴着父元素(默认为body文本区域)的左右边框。而此浮动元素在文档流空出的位置...
分类：
Web程序 时间：
2015-05-17 21:28:49
阅读次数：
151
一些浮动模型的基本知识：浮动模型也是一种可视化格式模型，浮动的框可以左右移动（根据float属性值而定），直到它的外边缘碰到包含框 或者另一个浮动元素的框的边缘。浮动元素不在文档的普通流中，文档的普通流中的元素表现的就像浮动元素不存在一样.《CSS Mastery》里作者画了几个图非常有意思，可以帮...
分类：
Web程序 时间：
2015-05-17 21:28:24
阅读次数：
226
CSS代码1 width:500px; height:300px; float:left; margin-left:50%; position:relative; left:-250px; background-color:#CCC; 代码解读首先设置块元素的宽度和高度，这里宽度是必须的，高度可以不...
分类：
其他好文 时间：
2015-05-14 18:13:17
阅读次数：
131
方法一 ：为父元素应用 overflow：hidden
实际上，overflow：hidden声明的真正用途是防止包含元素被超大内容撑大。应用overflow：hidden之后，包含元素依然保持其设定的宽度，而超大的子内容则会被容器剪切掉。除此之外，overflow：hidden还有另一个作用，即它能可靠地迫使父元素包含其浮动的子元素。
方法二：同时浮动父元素
第二种促使父元素包围其浮动子元...
分类：
其他好文 时间：
2015-05-10 13:01:32
阅读次数：
110
36、如果想让多个块显示在同一行中，可以将这些块设置成浮动，并且浮动方向相同。
37、清除浮动
当元素有浮动属性时，会对其父元素或者后面的元素产生影响，会出现一个布局错乱现象，可以通过清除浮动的方法来解决，
浮动元素的影响
浮动的清理(clear)：
none：默认值。允许两边都可以有浮动对象
left：不允许左边有浮动对...
分类：
Web程序 时间：
2015-04-27 09:54:00
阅读次数：
218
让IE7飙泪的浮动兼容性问题（IE6已死）一.浮动元素在倒数2个莫名垂直间距，在ie7以及IE7以下版本都有这一bug。 1.1莫名的bug,该怎么解决呢？二、浮动元素倒数两个元素重合问题IE8出现，IE7没有此问题。三、浮动元素楼梯排列问题。四、浮动元素和元素不在同一行的问题。参考文章：慕课网：....
分类：
Web程序 时间：
2015-04-25 22:24:02
阅读次数：
156
1）添加额外标签
这是在学校老师就告诉我们的 一种方法，通过在浮动元素末尾添加一个空的标签例如 ，其他标签br等亦可。
再如：
1）添加额外标签
.main{float:left;}
<div...
分类：
其他好文 时间：
2015-04-24 19:20:27
阅读次数：
131
