CSS属性vertical-align
指定了display设置为inline或者table-cell(例如td)元素的垂直对齐方式。
因此,如果一个元素display为block(例如div),即使设定vertical-align,并不会使内容垂直对齐。
其初始值为baseline
,语法为:
vertical-align: baseline /* keyword values */
vertical-align: sub
vertical-align: super
vertical-align: text-top
vertical-align: text-bottom
vertical-align: middle
vertical-align: top
vertical-align: bottom
vertical-align: 10em /* <length> values */
vertical-align: 4px
vertical-align: 20% /* <percentage> values */
vertical-align: inherit
- 如果只有一行文本需要居中,则可以设定line-height(最好height设为和line-height一致)
- 绝对定位方式,即
top: 50%; margin-top: -(height/2)px
- 将元素display设置成table-cell,然后CSS设置
vertical-align: middle
- 如果display为inline(或者inline-block),则表现的像img的废弃的align属性,例如如果将
vertical
设置为bottom,则周边文字的底部和图片的底部对齐。