float: left | right | none | inherit;(只能左右浮动,不能上下浮动)
float特征:
块在一排显示
内联支持宽高
默认内容撑开宽度
脱离文档流
提升层级半层
clear清除浮动:
clear : left | right | both | none | inherit; (元素的某个方向上不能有浮动元素)
clear : both; (在左右两侧均不允许浮动元素)
清除浮动的方法:
加高(问题:扩展性不好)
父级浮动(问题:页面中所有元素都加浮动,margin左右自动失效)
inline-block 清除浮动方法(问题:margin左右auto失效)
空标签清浮动(问题:IE6最小高度19px;(解决后IE6下还有2px偏差))
br 清除浮动(问题:不符合工作中:结构、样式、行为,三者分离的要求)
after伪类 清除浮动方法:给元素尾部添加内容或者zoom缩放(触发IE下 haslayout,使元素根据自身内容计算宽高,FF不支持)
overflow:hidden 清除浮动(问题:需要配合宽度或者zoom 兼容IE6、IE7)
(overflow: scroll | auto | hidden; overflow: hidden;溢出隐藏)
CSS定位:
只有position属性值为relative、absolute、fixed才可以使用,top、right、bottom、left属性。
static静态定位(不对它的位置进行改变)
fixed固定定位(参照物—浏览器窗口)——做弹窗广告用(生成固定定位的元素,相对于浏览器窗口进行定位)
relative相对定位(参照物以他本身)(生成相对定位的元素,相对于其正常位置进行定位)
absolute(绝对定位)(除了static都可以,找到参照物,与它最近的已经有定位的父元素进行定位)(生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位)