HTML <img> 标签align属性

<img>标签align属性定义和用法

align属性根据周围元素指定图像的对齐方式。
<img>元素是一个内联元素（它不会在页面上插入新行），这意味着文本和其他元素可以环绕它。因此，根据周围元素指定图像的对齐可能是有用的。
HTML5中不支持<img>的align属性。请改用CSS。
要使图像对齐中间，顶部或底部，请使用CSS属性 vertical-align。
要使图像向左或向右对齐，请使用CSS属性 float。

<img>标签align属性浏览器支持

Edge/IE	Chrome	FireFox	Safari	Opera

支持	支持	支持	支持	支持

不推荐使用align属性，但所有主流浏览器仍然支持。

HTML4.01和HTML5之间的差异

HTML5不支持align属性。

<img>标签align属性语法

<img>标签align属性实例

<!DOCTYPE html>
<html>
<body>
<h1><img> align属性</h1>

<p><strong>注意:</strong> HTML5中不支持align属性。改用CSS代替！</p>

<h2>align="bottom" (默认):</h2>
<p>这是一些文字。 <img src="/images/smiley.png" alt="Smiley face" width="42" height="42"> 这是一些文字。</p>

<h2>align="middle":</h2>
<p>这是一些文字。 <img src="/images/smiley.png" alt="Smiley face" width="42" height="42" align="middle"> 这是一些文字。</p>

<h2>align="top":</h2>
<p>这是一些文字。 <img src="/images/smiley.png" alt="Smiley face" width="42" height="42" align="top"> 这是一些文字。</p>

<h2>align="right":</h2>
<p>这是一些文字。 <img src="/images/smiley.png" alt="Smiley face" width="42" height="42" align="right"> 这是一些文字。</p>

<h2>align="left":</h2>
<p>这是一些文字。 <img src="/images/smiley.png" alt="Smiley face" width="42" height="42" align="left"> 这是一些文字。</p>

</body>
</html>

尝试一下

<img>标签align属性值

属性值	描述
left	将图像对齐到左侧
right	将图像对齐到右侧
middle	将图像对齐在中间
top	将图像对齐在顶部
bottom	将图像对齐在底部