定位是什么
- 定位是排版页面元素的一种方式
- 这种方式的特点是精确控制元素的位置
- 只有定位布局可以做到精确控制元素的位置
定位的分类
相对定位
- 相对定位是参照自身位置定位
绝对定位
- 绝对定位是参照父级定位
固定定位
- 固定定位是参照浏览器窗口定位
定位参照物
相对定位是参照自身位置定位
绝对定位是参照父级定位
固定定位是参照浏览器窗口定位
1、相对定位的实现步骤
- 第一步：为要定位的元素添加
position:relative - 第二步：设置坐标：
left | top | right | bottom
2、绝对定位的实现步骤
- 第一步：为要定位的元素添加
position:absolute - 第二步：设置定位的坐标：
left | top | right | bottom - 第三步：设置定位父级：
position:relative
如果不设置定位父级，那么定位父级就是文档（body）
3、固定定位实现步骤
- 第一步：为要定位的元素添加
position:fixed - 第二步：设置定位坐标：
left |top | right | bottom
