css盒子的浮动与定位

张大晴 2017-02-18

1. 盒子浮动 float

Float 属性:

默认是 none ,按照标准流来定位;

Left:左悬浮;

Right:右悬浮;

2. 使用 clear 清除浮动的影响

Clear 属性:

默认是 none,允许两边都可以有浮动对象;

Left: 不允许左边有浮动对象

Right:不允许右边有浮动对象

Both:不允许有浮动对象

3. 盒子定位 position

Position 属性:

默认是 static,按照标准流来定位;

Relative:相对定位,相对于原本的标准位置偏移指定的距离;

Absolute:绝对定位,以它的包含框为基准进行偏移;

Fixed:固定定位,以浏览器窗口为基准进行定位;

4. z-index 空间位置

Z-index 空间位置,默认是 0,z-index 值大的页面位于其值小的上方;

5. 盒子 display 属性

Display:

Inline:把元素变成内联元素;

Block:把元素变成块级元素;

相关推荐