水平垂直布局
内联元素
- 水平居中
- 设置父级样式
- text-align:center
- 垂直居中
- 设置父级样式
- line-heigh:父级高度
块级元素
- 水平居中
- 设置自身
- margin-left:auto
- margin-right:auto
- 垂直居中
- 设置自身
- margin-top:父级的高度的一半
- transform:translateY(-50%);
行内块
- 水平居中
- 设置父级
- text-align:center
- 垂直居中
- 设置自身
- margin-top:父级高度的一半
- transform:translateY(-50%);
浮动元素
- 水平居中
- 设置自身
- margin-left:50%
- transform:translate(-50%,0)
- 垂直居中
- 设置自身
- margin-top: 父级高度的一半
- transform:translate(0,-50%)
定位元素
- 水平居中
- 设置自身
- left:50%
- transform:trans