这是我参与2022首次更文挑战的第16天
六、子绝父相的由来
问题：
绝对定位和相对定位到底有什么使用场景呢？
为什么说相对定位给绝对定位当爹的呢？
弄清楚这个口诀，就明白了绝对定位和相对定位的使用场景。
这个“子绝父相”太重要了，是我们学习定位的口诀，是定位中最常用的一种方式这句话的意思是：子级是绝对定位的话，父级要用相对定位。
1.子级绝对定位，不会占有位置，可以放到父盒子里面的任何一个地方，不会影响其他的兄弟盒子。
2.父盒子需要加定位限制子盒子在父盒子内显示。
3.父盒子布局时，需要占有位置，因此父亲只能是相对定位。
这就是子绝父相的由来，所以相对定位经常用来作为绝对定位的父级。
总结：
1.因为父级需要占有位置，因此是相对定位
2.子盒子不需要占有位置，则是绝对定位
3.当然，子绝父相不是永远不变的，如果父元素不需要占有位置，子绝父绝也会遇到。
七、固定定位fixed（重要）
固定定位是元素固定于浏览器可视区的位置。主要使用场景：可以在浏览器页面滚动时元素的位置不会改变。
语法：
选择器 {
position: fixed;
}
注意，固定定位的特点：（务必记住）
- 以浏览器的可视窗口为参照点移动元素。
1）跟父元素没有任何关系
2）不随滚动条滚动。 - 固定定位不在占有原先的位置。
固定定位也是脱标的，其实固定定位也可以看做是一种特殊的绝对定位。
3.固定定位小技巧： 固定在版心右侧位置。
小算法：
1)让固定定位的盒子 left: 50%. 走到浏览器可视区（也可以看做版心）的一半位置。
2)让固定定位的盒子 margin-left: 版心宽度的一半距离,多走版心宽度的一半位置，就可以让固定定位的盒子贴着版心右侧对齐了。
八、粘性定位sticky（了解）
粘性定位可以被认为是相对定位和固定定位的混合，Sticky 粘性的。
1.语法
选择器 {
position: sticky; top: 10px;
}
2.注意点，粘性定位的特点：
1）以浏览器的可视窗口为参照点移动元素（固定定位特点）
2）粘性定位占有原先的位置（相对定位特点）
3）必须添加 top 、left、right、bottom 其中一个才有效
4）跟页面滚动搭配使用。 兼容性较差，IE 不支持。
