vertical-align

定义

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

注意：该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐方式。

语法

vertical-align:baseline|A|inherit;

注意：A包含8种属性，见下表所示。

属性值

值	描述
normal	默认。不使用附加的嵌入层面。
embed	创建一个附加的嵌入层面。
bidi-override	创建一个附加的嵌入层面。重新排序取决于 direction 属性。
initial	设置该属性为它的默认值。
inherit	从父元素继承该属性。

实例

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>NTHOME-零基础入门学习Web（HTML5+CSS3）</title>
    <style type="text/css">
        .top {vertical-align:text-top}
        .bottom {vertical-align:text-bottom}
    </style>
</head>
<body>
   <p>
       这是一幅<img class="top" border="0" src="../img/logo.png" height="33px;"/>位于段落中-top的图像。
   </p>
   <p>
       这是一幅<img class="bottom" border="0" src="../img/logo.png" height="33px;"/>位于段落中-bottom的图像。
   </p>
</body>
</html>

这是一幅位于段落中-top的图像。

这是一幅位于段落中-bottom的图像。

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

Safari	Chrome	FireFox	IE
1.0	1.0	1.0	4.0