CSS vertical-align 属性垂直对齐方式

通过vertical-align属性可以改变内联元素的垂直对齐方式。top和bottom值使内联元素的顶部边或底部边对齐内联盒子的顶部边和底部边,内联盒子的高度由line-height属性来决定。如果没有明确指定line-height属性,那么高度由它里面的所有元素内容来决定。text-bottom或text-top属性由所使用的字体来决定。
对于表格单元格元素,过去我们会使用valign属性来设置单元格的对齐方式,这个属性现在已经过时,可以使用vertical-align属性来设置单元格内容的对齐方式。例如:

td {
 vertical-align: middle;
}

也可以为display: table-cell的元素设置垂直对齐方式。例如:

div {
 display: table-cell;
 vertical-align: middle;
}

注意这里是设置div中的内容的垂直对齐方式为居中对齐,而不是div本身垂直居中对齐。
另外,<p>段落元素和标题元素都是块级元素,不能在它们上面使用vertical-align属性。

版权声明:除特别注明外,本站所有文章均为澳门葡京官网原创

转载请注明:出处来自澳门葡京官网 » CSS vertical-align 属性垂直对齐方式

发表评论

电子邮件地址不会被公开。 必填项已用*标注

  1. lonlyme说道:

    :biggrin: 多多学习了

  2. 演员说道:

    第一次来访,表示支持

  3. 罗拉说道:

    呵呵。学习了。感触良多!