定位
作用:灵活改变盒子的位置
实现;
定位模式:position
边偏移:设置盒子的位置
left,right,top,bottom
相对定位:
position:relative
改变参照物,自己原来的位置
不托标,站位,
不改变自身的显示模式
绝对定位:
使用场景:子级绝对定位,父级相对定位(子绝父相)
脱标不占位
2.参照物:先找最近的定位好的祖先元素,都没有参照浏览器可视区改
3.显示模式特点改变,宽高生效;
定位居中:
实现步骤:
绝对定位,
水平和垂直,偏移50%
子级向左,向上移动移动自身尺寸的一半
transform:translate(-50%,-50%)简化的margin-left
position:fixed
元素滚动时,标签不会发生滚动
特点,不占位
会改变,显示模式特点
堆叠层级z-index
默认效果,按照标签书写顺序,后来者居上
作用:设置定位元素的层级顺序,改变定位元素的显示顺序