本文介紹HTML img align屬性根據(jù)周?chē)脑刂付▓D像的對(duì)齊方式, <img>元素是一個(gè)內(nèi)聯(lián)元素(它不會(huì)在頁(yè)面上插入新行),這意味著文本和其他元素可以環(huán)繞它。因此,根據(jù)周?chē)刂付▓D像的對(duì)齊方式可能很有用。
設(shè)置文本中的圖像的幾種對(duì)齊方式:
<!DOCTYPE html> <html> <head> <title>HTML:<img> align 屬性 - 菜鳥(niǎo)教程 (cainiaoplus.com)</title> <body> <h2>align="bottom" (default):</h2> <p>This is some text. <img src="haha.gif" alt="haha face" width="42" height="42"> This is some text.</p> <h2>align="middle":</h2> <p>This is some text. <img src="haha.gif" alt="haha face" width="42" height="42" align="middle"> This is some text.</p> <h2>align="top":</h2> <p>This is some text. <img src="haha.gif" alt="haha face" width="42" height="42" align="top"> This is some text.</p> <h2>align="right":</h2> <p>This is some text. <img src="haha.gif" alt="haha face" width="42" height="42" align="right"> This is some text.</p> <h2>align="left":</h2> <p>This is some text. <img src="haha.gif" alt="haha face" width="42" height="42" align="left"> This is some text.</p> </body> </html>測(cè)試看看 ?/?
IEFirefoxOperaChromeSafari
所有主流瀏覽器都支持 align 屬性。
HTML5 不支持 <img> align 屬性。請(qǐng)使用 CSS 替代。
在 HTML 4.01 中,<img> 的 align 屬性 已廢棄。
align屬性根據(jù)周?chē)脑刂付▓D像的對(duì)齊方式。
<img>元素是一個(gè)內(nèi)聯(lián)元素(它不會(huì)在頁(yè)面上插入新行),這意味著文本和其他元素可以環(huán)繞它。因此,根據(jù)周?chē)刂付▓D像的對(duì)齊方式可能很有用。
在 HTML 4.01 中,<img> 的 align 屬性已廢棄。請(qǐng)使用 CSS 替代。
CSS 語(yǔ)法:<img style="float:right">
在我們的 CSS 教程中,您可以找到更多有關(guān) float 屬性的細(xì)節(jié)。
<img align="left|right|middle|top|bottom">
值 | 描述 |
---|---|
left | 把圖像對(duì)齊到左邊。 |
right | 把圖像對(duì)齊到右邊。 |
middle | 把圖像與中央對(duì)齊。 |
top | 把圖像與頂部對(duì)齊。 |
bottom | 把圖像與底部對(duì)齊。 |