定義和用法

<img> 標(biāo)簽的 align 屬性定義了圖像相對(duì)于周圍元素的水平和垂直對(duì)齊方式。

詳細(xì)說明

標(biāo)準(zhǔn)沒有定義圖像相對(duì)于其他文字和與其處于同一行中的其他圖像的對(duì)齊關(guān)系。HTML 圖像在行中出現(xiàn)時(shí)通常只伴有一行文字。而通常的印刷媒體，像雜志，則把文字在圖像的周圍進(jìn)行環(huán)繞，這樣就會(huì)有很多行文字與圖像相鄰，而不只是一行。

幸運(yùn)的是，文檔設(shè)計(jì)者可以通過 <img> 標(biāo)簽的 align 屬性來控制帶有文字包圍的圖像的對(duì)齊方式。HTML 和 XHTML 標(biāo)準(zhǔn)指定了 5 種圖像對(duì)齊屬性值：left、right、top 、middle 和 bottom。left 和 right 值會(huì)把圖像周圍與其相連的文本轉(zhuǎn)移到相應(yīng)的邊界中；其余的三個(gè)值將圖像與其相鄰的文字在垂直方向上對(duì)齊。Netscape 又增加了 4 種垂直對(duì)齊屬性：texttop、absmiddle、baseline 和 absbottom，Internet Explorer 則增加了 center。

注意：不同的瀏覽器以及同一瀏覽器的不同版本對(duì) align 屬性的某些值的處理方式是不同的。

注意：HTML 4.01 不推薦使用 align 屬性，XHTML 1.0 Strict DTD 不支持該屬性，同時(shí) HTML 5 也不再支持該屬性。

實(shí)例

設(shè)置文本中的圖像的對(duì)齊方式：

<img src="/i/eg_cute.gif" align="middle" />

親自試一試

瀏覽器支持

雖然不贊成使用 align，但是幾乎所有瀏覽器都支持該屬性。

兼容性注釋

不贊成使用 align 屬性和 <center> 標(biāo)簽

HTML 4 和 XHTML 中不再推薦使用所有標(biāo)準(zhǔn)中的 align 屬性，當(dāng)然包括 <img> 的 align 屬性，以便使用樣式表。同時(shí)不再使用 <center> 標(biāo)簽。

然而，該屬性及標(biāo)簽在 HTML 創(chuàng)作者中非常流行，并且現(xiàn)在流行的瀏覽器都能很好地支持它們。所以，雖然我們期望 align 和 <center> 將來有一天會(huì)消失，但還需要等待很長(zhǎng)一段時(shí)間。

解決方案

如果您不想使用 align 和 <center> 時(shí)該怎么辦呢？您可以使用 HTML/XHTML 表格來對(duì)齊內(nèi)容。不過更好的方案是使用樣式。例如，margin-left 屬性 可以對(duì)圖像進(jìn)行縮進(jìn)，而 float 屬性 可以實(shí)現(xiàn)文本包圍圖像的效果。

實(shí)例

<img style="float:right" />

親自試一試

語法

<img align="value" />

屬性值