relative:依据自身定位
absolute:依据最近一层的定位元素定位定位元素:
水平居中方法:
- inline元素: text-align: center
- block元素: margin: auto
- absolute元素:left: 50% + margin-left 负值(需要知道子元素的宽)
垂直居中方法:
- inline元素:line-height 的值等于height值
- absolute元素: top: 50% + margin-top负值(必须要知道子元素的高)
- absolute元素: transform(-50%,-50%)(不需要知道子元素的高):
top、left设为50%,然后用transform: translate(-50%,-50%) - absolute元素: top, left, bottom, right = 0 + margin: auto(不需要知道子元素的高):
top: 0; bottom: 0; left: 0; right: 0; margin: auto;