CSS vertical-align 属性
示例
垂直对齐图像
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
| 默认值 | baseline |
|---|---|
| 继承 | 否 |
| 可动画 | 是。 了解有关 可动画 的信息 试一试 |
| 版本 | CSS1 |
| JavaScript 语法 | object.style.verticalAlign="top" 试一试 |
浏览器支持
表中的数字指定完全支持该属性的第一个浏览器版本。
| 属性 | |||||
|---|---|---|---|---|---|
| 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;
属性值
| 值 | 描述 | 演示 |
|---|---|---|
| baseline | 元素与父元素的基线对齐。这是默认值 | 演示 ❯ |
| length | 根据指定的长度提升或降低元素。允许使用负值。 了解有关长度单位的信息 | 演示 ❯ |
| % | 根据“line-height”属性的百分比提升或降低元素。允许使用负值 | 演示 ❯ |
| sub | 元素与父元素的下标基线对齐 | 演示 ❯ |
| super | 元素与父元素的上标基线对齐 | 演示 ❯ |
| top | 元素与该行上最高元素的顶部对齐 | 演示 ❯ |
| text-top | 元素与父元素字体的顶部对齐 | 演示 ❯ |
| middle | 元素放置在父元素的中间 | 演示 ❯ |
| bottom | 元素与该行上最低元素的底部对齐 | 演示 ❯ |
| text-bottom | 元素与父元素字体的底部对齐 | 演示 ❯ |
| initial | 将此属性设置为其默认值。 了解有关 initial 的信息 | |
| inherit | 从其父元素继承此属性。 了解有关 inherit 的信息 |
相关页面
CSS 教程： CSS 文本对齐
HTML DOM 参考： verticalAlign 属性
