目录

CSS vertical-align 属性

❮上一节完整的CSS参考下一节❯

示例

垂直对齐图片：

img.a {
  vertical-align: baseline;
}

img.b {
  vertical-align: text-top;
}

img.c {
vertical-align: text-bottom;
}

img.d {
vertical-align: sub;
}

img.e {
  vertical-align: super;
}

亲自试一试 »

定义和用法

这个vertical-align属性设置元素的垂直对齐方式。

展示演示❯

默认值：	基线
遗传：	不
可动画：	是的。阅读可动画的尝试一下
版本：	CSS1
JavaScript 语法：	对象.style.verticalAlign="top"尝试一下

浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

Property
vertical-align	1.0	4.0	1.0	1.0	4.0

CSS 语法

vertical-align: baseline| length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit;

属性值

Value	Description	Demo
baseline	The element is aligned with the baseline of the parent. This is default	Demo ❯
length	Raises or lower an element by the specified length. Negative values are allowed. Read about length units	Demo ❯
%	Raises or lower an element by a percent of the "line-height" property. Negative values are allowed	Demo ❯
sub	The element is aligned with the subscript baseline of the parent	Demo ❯
super	The element is aligned with the superscript baseline of the parent	Demo ❯
top	The element is aligned with the top of the tallest element on the line	Demo ❯
text-top	The element is aligned with the top of the parent element's font	Demo ❯
middle	The element is placed in the middle of the parent element	Demo ❯
bottom	The element is aligned with the lowest element on the line	Demo ❯
text-bottom	The element is aligned with the bottom of the parent element's font	Demo ❯
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

相关页面

CSS教程：CSS 文本对齐

HTML DOM 参考：垂直对齐属性

❮上一节完整的CSS参考下一节❯