【HTML】已经废弃的 align（图像对齐方式）

学习委员

关注

发布于: 2021 年 01 月 14 日

今天讲的一个属性是已经废弃了的。写这个笔记主要是给过去的习惯画一个句号。

align 特性通常用来表明页面的其他部分怎么环绕在图像周围。但 HTML5 不再支持这一特性，新建的网站通常都会使用 CSS 来控制图像的对齐方式，而不会再在元素标签里面使用这个特性了。

下面的代码里，所使用到的图片是我事先准备好的。

先看看代码

<!DOCTYPE html><html lang="en"><head>	<meta charset="UTF-8">	<title>img</title></head>
<body>	<p>		<img    	src="images/redWineLogo.jpg"      alt="red wine"      width="100px"      height="100px"      align="left"     />		不过，这里还必须加注“熟成的波尔多”这几个字。波尔多葡萄酒的发展其实是由英国带起的（法国南部一带[包括波尔多地区]统称阿奎丹大洲，古时候此地曾为阿奎丹公国。阿奎丹公国的公爵夫人与英国国王结婚，阿奎丹也因此成为英国的领土[1152年~1453年]。），英国人偏好熟成的葡萄酒，也因此出现了“波尔多需熟成10年以上再饮用”这样的名言。	</p></body>
</html>

复制代码

留意 <img> 标签，最后有一个 align 属性，值为 left。

效果图

再来看第二段代码

<!DOCTYPE html><html lang="en">
<head>	<meta charset="UTF-8">	<title>img</title></head>
<body>	<p>		<img			src="images/redWineLogo.jpg"      alt="red wine"      width="100px"      height="100px"      align="right"    />		不过，这里还必须加注“熟成的波尔多”这几个字。波尔多葡萄酒的发展其实是由英国带起的（法国南部一带[包括波尔多地区]统称阿奎丹大洲，古时候此地曾为阿奎丹公国。阿奎丹公国的公爵夫人与英国国王结婚，阿奎丹也因此成为英国的领土[1152年~1453年]。），英国人偏好熟成的葡萄酒，也因此出现了“波尔多需熟成10年以上再饮用”这样的名言。	</p></body></html>

复制代码

<img> 标签最后一个属性是 align ，值为 right。

效果图

之说以讨论 align 特性，是因为如果平时在查看一些旧网站的时候，很可能就会遇到它。而一些可视化编辑器仍然会在你设定图像的对齐方式时向代码插入 align 特性。

比如旧版本的 Dreamweaver，我读大学时，课堂上用的就是 Dreamweaver。

再次提醒的是：这里所说的 align 特性，H5 是不支持在标签里面添加这个属性，但仍然支持在 CSS 用这个特性的。

align 支持以下几个比较常用的特性

left（水平对齐）

该特性值将图像左对齐（使文本环绕在图像的右边）。即图像会被置于左侧，同时文本环绕在它周围。

right（水平对齐）

该特性值将图像右对齐（使文本环绕在图像的左边）。即图像会被置于右侧，同时文本环绕在它周围。

top（垂直对齐）

该值将周围文本的第一行与图像的顶端对齐。即 top 值将文本的第一行置于靠近图像顶端的位置，后方的文本行则在图像的下方显示。

middle（垂直对齐）

该值将周围文本的第一行与图像的中间对齐。即 middle 值将文本的第一行置于靠近图像的中间位置，后方的文本行则在图像的下方显示。

bottom（垂直对齐）

该值将周围文本的第一行与图像的低端对齐。即 bottom 值将文本的第一行置于靠近图像低端的位置，后面的文本行则在图像的下方显示。

懒得上代码~

H5 又不支持，感觉讲了一章废话~

发布于: 2021 年 01 月 14 日阅读数: 14

学习委员

关注

反派 2019.03.19 加入

哈哈哈哈哈哈哈哈哈哈哈哈哈哈

发布

暂无评论

创作场景

【HTML】已经废弃的 align（图像对齐方式）

学习委员

评论