HTML Reference Manual

HTML Tag Directory

HTML: <img> align attribute

This article introduces the HTML img align attribute, which specifies the alignment of an image based on surrounding elements. The <img> element is an inline element (it does not insert a new line on the page), which means text and other elements can wrap around it. Therefore, specifying the alignment of an image based on surrounding elements may be very useful.

　HTML <img> tag

Online Example

Set several alignment methods for images in text:

Example

<!DOCTYPE　html>
<html>
<head>
<title>HTML:<img>　align　attribute　-　基础教程网　oldtoolbag.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>

Test it out ‹/›

Browser Compatibility

IEFirefoxOperaChromeSafari

All major browsers support the align attribute.

Definition and Usage

HTML5 The <img> align attribute is not supported. Please use CSS instead.

In HTML 4.01 In the <img> tag's align attribute has been deprecated.

The align attribute specifies the alignment of the image based on surrounding elements.

The <img> element is an inline element (it does not insert a new line on the page), which means text and other elements can wrap around it. Therefore, specifying the alignment of the image based on surrounding elements may be very useful.

Compatibility notes

In HTML 4.01 In the <img> tag's align attribute has been deprecated. Please use CSS instead.

CSS Syntax: <img style="float:right">

CSS Example: Float image to the right

In our CSS tutorial, you can find more about float attributedetails.

Syntax

<img align="left|right|middle|top|bottom">

Attribute value

Value	Description
left	Align the image to the left.
right	Align the image to the right.
middle	Align the image with the center.
top	Align the image with the top.
bottom	Align the image with the bottom.

　HTML <img> tag

HTML: <template> tag