对于行内元素,或者用设置display为inline-block的元素而言,水平方向的对齐并不容易
行内元素特点
- 行内元素无法设置
width
和height
inline-block
可以设置width
和height
pading
属性四个方向均可设置margin-left
和margin-right
可以设置,水平方向不可设置
由于无法设置margin想要实现水平居中只能使用vertical-align
设置
vertical-align所有属性值:baseline,top,middle,bottom,text-top,text-bottom
通过设置vertical-align: middle;
实现水平方向对齐,注意只能设置在行内元素或者行内块元素中