CSS 合集 2 (定位)
1. absolute 和 relative 分别依据什么定位
absolute
依据最近一层的定位元素(absolute relative fixed body)定位
relative
依据自身定位
2. 居中对齐有哪些实现方式(重要)(※)
水平居中
inline 元素:
text-align: center
block 元素:
margin: auto
absolute 元素:
必须知道元素的宽:left: 50% + margin-left: -(width/2)px
垂直居中
inline 元素:
line-height 的值等于 height 的值
absolute 元素:
必须知道元素的高:top: 50% + margin-top: -(height/2)px
水平垂直居中
无需知道元素的宽和高:
absolute 元素:
position: absolute + left: 0 + top: 0 + right: 0 + bottom: 0 + margin: auto
CSS3:
transform: translate(-50%, -50%) + position: absolute + left: 50% + top: 50%