HTML - align 属性

HTML algin 属性用于指定 HTML 元素中内容的对齐方式（居中、左对齐或右对齐）。

但是，在现代 HTML 中，align 属性已被弃用，取而代之的是使用 CSS 进行布局和对齐。CSS 是现代 Web 开发中设置元素样式和定位元素的标准方式，因为它提供了对齐和显示的更精确的控制。

语法


<tag align = "value"></tag>

适用于

下面列出的元素允许使用 HTML align 属性。

元素	描述
<img>	HTML <img> 标签用于在文档中附加图像。
<table>	HTML <table>标签允许我们通过提供行和列工具以有组织的方式放置数据。
<iframe>	HTML <iframe> 是一个内联框架，允许我们在当前 HTML 文档中嵌入另一个文档。
<caption>	HTML <caption> 标签用于指定表元素的标题。
<col>	HTML <col> 标签用于提供有关列的信息。
<applet>	HTML <applet> 标签用于在 HTML 文档中嵌入 Java 小程序。
<colgroup>	HTML <colgroup> 标签用于描述表中一列或多列的集合，以便进行格式设置。
<hr>	HTML <hr> 标签用于在网页上创建水平线。
<legend>	HTML <legend>标签用于指定fieldset元素的标题。
<tbody>	HTML <tbody>标签用于在 HTML 表中创建一个单独的语义块，用于定义表的正文内容。
<td>	HTML <td>标签用于定义表的数据单元格，并用作 tr 元素的子元素。
<tfoot>	HTML <tfoot>标签用于对 HTML 表中的页脚内容进行分组。
<th>	HTML <th> 标签指定 HTML 表格的标题单元格。
<thead>	HTML <thead> 标签用于对HTML表的标题内容进行分组
<tr>	HTML <tr> 标签用于定义表中的每一行。

HTML align 属性的示例

在以下示例中，我们将讨论如何使用 algin 属性的不同方法。

将属性与 h1 和 p 标签对齐

下面的代码演示了如何使用 algin 属性对齐 h1 和 p 标签


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML align attribute</title>
</head>
<body>
	 <!--example of the align attribute-->
	 <h1 align="left">This is h1 heading.</h1>
	 <p align="center">Text within the p tag.</p>
</body>

</html>

将属性与 div 标签对齐

考虑另一种情况，我们将使用 align 属性和 div 元素。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML align attribute</title>
	 <style>
			div {
				 color: green;
				 font-weight: bolder;
			}
	 </style>
</head>

<body>
	 <!--example of the align attribute-->
	 <div align="right">
			<p>
			Text within the p tag(it will display
			the right side of the screen view 
			because we have used align = "right").
			</p>
	 </div>
</body>

</html>

将属性与表单标签对齐

让我们看一下以下示例，我们将在其中使用 align 属性与表单。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML align attribute</title>
	 <style>
			form {
				 width: 300px;
				 height: 210px;
				 background-color: rgb(21, 114, 185);
				 color: white;
				 border-radius: 10px;
			}

			form button {
				 width: 100px;
				 padding: 5px;
			}
	 </style>
</head>

<body>
	 <!--example of the align attribute-->
	 <form align="center">
			<h1 align="center">Login</h1> 
			Username: <input type="text">
			<br>
			<br> Password:<input type="password">
			<br>
			<br>
			<button>Login</button>
	 </form>
</body>

</html>

支持的浏览器

浏览器
是否支持	Yes	Yes	Yes	Yes	Yes

打印本页