属性：position定位：

定位：
概念：让元素去某一个位置，去到任意一个你指定的位置
属性：position
取值：
static---------静态定位，元素正常显示(默认值)
relative-------相对定位，相对于自己原有的位置行进位置的改变
参照物：自已原有的位置
absolute-------绝对定位
父子关系中：
1、如果父元素没有定位，此时子元素绝对定位，参照物是浏览器窗口第一屏幕(保证页面有滚动条)
2、如果父元素有定位，此时子元素绝对定位，子元素位置改变，参照物是父元素（找离自己最近的有定位的元素）
父元素通常使用的定位是相对定位，称之为父相子绝
父元素只要有定位即可（不是静态定位就可以）
fixed---------固定定位，参照物就是浏览器窗口
sticky--------粘性定位，用来实现吸顶效果,参照物是距离最近的有滚动条的容器
位移属性：
元素定位后，需要配合位移属性才能更改元素的位置
top/left/right/bottom
位移属性取值为正数，向元素正中心方向移动
位移属性取值为负数，向元素四周发散方向移动
定位带来的影响：
1、相对定位：
兄弟关系中，元素添加相对定位，后面定位元素会遮盖前面定位元素，产生层叠行
如果想要调整层级关系，需要使用层叠属性
z-index:数值；
默认值：auto；等同于0
取值可以为正数，也可以是负数，数值越大层级越高
注意：z-index只能应用在定位元素上面
2、绝对定位：(固定定位)
1)元素添加绝对定位，会脱离文档流，在页面中不占位置，后面不定位元素会自动补位
2)兄弟关系中，元素添加绝对定位，后面定位元素会遮盖前面定位元素，产生层叠性
如果想要调整层级关系，需要使用层叠属性
定位与浮动：
区别：
元素添加浮动是半脱离文档流，后面补位元素中的文本内容不会背覆盖，会实现文本环绕效果
元素添加绝对定位是完全脱离文档流，后面补位元素中的文本内容会背覆盖，不会实现文本环绕效果
相同点：
1、如果补位元素中没有文本内容，效果相同
2、都会改变元素类型，变成块元素
如何实现元素水平垂直居中？
1、元素在浏览器窗口水平垂直居中
div{
width:600px;
height:400px;
background-color: red;
position: fixed;
top:50%;
left:50%;
margin-top: -200px;
margin-left: -300px;
}
2、元素在盒子中水平垂直居中
详见demo4.html
锚点：
用途：在当前页面不同区域进行跳转
应用场景：小说章节目录跳转、通讯录区域
语法：
第一章

（注意：只能使用id）
锚点名是我们自己起的