上诉办法是在需要清除浮动的地方加个div.clear或者br.clear,我们知道这样能解决基本清浮动问题。 但是这种方法的最大缺陷就是改变了html结构,虽然只是加个div。 最优浮动闭合方案(这是我们推荐的): 用法很简单,在浮动元素的父云素上添加class=”demo clearfix”。 你 ...
分类:
其他好文 时间:
2016-07-13 15:53:29
阅读次数:
124
IE6双倍边距bug 当页面内有多个连续浮动时,如本页的图标列表是采用左浮动,此时设置li的左侧margin值时,在最左侧呈现双倍情况。如外边距设置为10px, 而左侧则呈现出20px,解决它的方法是在浮动元素上加上display:inline;的样式,这样就可避免双倍边距bug。 3像素问题及解决 ...
分类:
Web程序 时间:
2016-07-08 21:48:32
阅读次数:
222
浮动定位是指 1.1将元素排除在普通流之外,即元素将脱离标准文档流 1.2元素将不在页面占用空间 1.3将浮动元素放置在包含框的左边或者右边 1.4浮动元素依旧位于包含框之内 2. 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止经常使用它来实现特殊的定位效果 3.包含框 ...
分类:
Web程序 时间:
2016-07-08 11:45:40
阅读次数:
131
页面布局方式,主要包含:文档流、浮动层、float属性。 ?html页面的标准文档流(默认布局)是:从上到下,从左到右,遇块(块级元素)换行。 ?浮动层:给元素的float属性赋值后,就是脱离文档流,进行左右浮动,紧贴着父元素(默认为body文本区域)的左右边框。而此浮动元素在文档流空出的位置,由后 ...
分类:
其他好文 时间:
2016-07-04 23:46:28
阅读次数:
561
BFC(块级格式化上下文) 一、BFC是什么? 从样式上看,具有BFC的容器和普通的容器没有区别。从功能上看,具有BFC的容器可以看作是隔离了的容器,容器里面的元素不会影响到外面的元素,并且BFC具有普通容器没有的一些特性,例如可以包含浮动元素,上文中的第二类清除浮动的方法(如overflow方法) ...
分类:
其他好文 时间:
2016-06-29 20:27:39
阅读次数:
124
浏览器兼容性问题是指因为不同的浏览器对同一段CSS代码解析不同导致页面显示效果不统一的情况。一般情况下,我们希望用户无论使用什么浏览器来查看网页效果都应该是一样的。浏览器的兼容性问题是Web前端开发人员经常会碰到的和必须要解决的问题。 一、浏览器兼容性问题总结1、双倍浮动边距:原因:多个并列浮动元素 ...
分类:
其他好文 时间:
2016-06-29 13:00:31
阅读次数:
110
1,在浮动元素后面增加<br/>标签; <br/>标签有自带的清除浮动属性; 2,在浮动元素后面增加一个清除浮动层; <div> <div style="float:left"></div> <div style="float:left"></div> <div style="clear:both" ...
分类:
其他好文 时间:
2016-06-27 16:58:19
阅读次数:
147
浮动不是一个正常流布局,浮动元素会从文档的正常流中删除,但是他还是会印象布局,浮动应用于所有的元素,当一个元素浮动时,其他内容会“环绕”该元素。 float属性有四个值:left,right分别浮动元素到相应的方向,none(默认),使元素不浮动,inherit将从父级元素获取float值 floa ...
分类:
其他好文 时间:
2016-06-21 22:31:53
阅读次数:
218
使用浮动(float)的一个比较疑惑的事情是他们怎么影响包含他们的父元素的。如果父元素只包含浮动元素,且父元素未设置高度和宽度的时候。那么它的高度就会塌缩为零。如果父元素不包含任何的可见背景,这个问题会很难被注意到,但是这是一个很重要的问题。在这里我们可以称为“塌陷”。如下图: 解决塌陷有以下三种方 ...
分类:
其他好文 时间:
2016-06-19 18:18:55
阅读次数:
101
我们知道,子元素浮动或者相对定位,元素都会脱离文档流。而父元素如果没有设置固定高度,在计算高度时,就不会计算浮动子元素所占的高度。但是,有时候我们需要父元素计算其所有子元素的的高度(包括浮动元素)来调整自己的宽高,以便调节自身的背景 border等,此时,只需要给父元素添加css属性: overfl ...
分类:
其他好文 时间:
2016-06-19 01:11:41
阅读次数:
164