css定位+锚点+pc端宽高自适应总结

Day15
1、 固定定位
Position:fixed; 固定定位
A:参照物：浏览器窗口；
B:不占据空间，脱离布局流；

让一个元素在浏览器窗口左右上下居中？
第一种方法：
Position:fixed;
Left:50%;right:50%;
Margin-left:-元素宽度的一半；
Margin-top:-元素高度的一半；
第二种方法：
Position:fixed;
Left:0;right:0;
Top:0;bottom:0;
Margin:auto;

2、 粘性定位
Position:sitcky;

执行逻辑：
默认情况下：当浏览器窗口滚动条不滚动，当前元素没有超出整个浏览器窗口的时候；执行position:relative; 如果元素超出当前窗口，则执行position:fixed;

3、 定位总结
Position:
Static 静态定位
Absolute 绝对定位
Relative 相对定位
Sticky 粘性定位

脱离布局流的定位：
Position:absolute;
Position:fixed;

	注：如果块状元素没有设置宽度的时候；添加position:absolute; / positon:fixed;出现宽度被内容撑开。

4、 超出版心的banner的实现方法
思路：
版心区域作为参照物
Banner图片，绝对定位，left:50%; （让图片最左侧和版心中心线对齐）<