CSS vertical-align 屬性

定義和用法

vertical-align 屬性設置元素的垂直對齊方式。

說明

該屬性定義行內元素的基線相對于該元素所在行的基線的垂直對齊。允許指定負長度值和百分比值。這會使元素降低而不是升高。在表單元格中,這個屬性會設置單元格框中的單元格內容的對齊方式。

另請參閱:

CSS 教程:CSS 文本

HTML DOM 參考手冊:verticalAlign 屬性

實例

垂直對齊一幅圖像:

img
  {
  vertical-align:text-top;
  }

親自試一試

CSS 語法

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

屬性值

描述
baseline 默認。元素放置在父元素的基線上。
sub 垂直對齊文本的下標。
super 垂直對齊文本的上標
top 把元素的頂端與行中最高元素的頂端對齊
text-top 把元素的頂端與父元素字體的頂端對齊
middle 把此元素放置在父元素的中部。
bottom 把元素的頂端與行中最低的元素的頂端對齊。
text-bottom 把元素的底端與父元素字體的底端對齊。
length  
% 使用 "line-height" 屬性的百分比值來排列此元素。允許使用負值。
inherit 規定應該從父元素繼承 vertical-align 屬性的值。

技術細節

默認值: baseline
繼承性: no
版本: CSS1
JavaScript 語法: object.style.verticalAlign="bottom"

更多實例

垂直對齊圖象
本例演示如何在文本中垂直排列圖象。

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 4.0