定位
relative
相对定位是相当对于自己原本的位置进行定位
absolute
绝对定位是相对于离当前元素最近的一层relative或absolute的元素进行定位
fixed
固定定位是相对于浏览器窗口进行定位
居中对齐的实现方式
水平居中
- inline居中:text-align: center
- block居中:margin:auto
- absolute: left:50% + margin-left: -元素宽度一半
- justify-content: center; -> flex布局
垂直居中
- inline元素:line-height等于height
- absolute: top:50% + margin-top: -元素高度一半
- absolute:transform(-50%, -50%) -> 不需要知道元素宽高
- absolute: top,left,right,bottom: 0 + margin: auto -> 不需要知道元素宽高
- align-item: center; -> flex布局