如何在 HTML 中设置文本对齐？

要在 HTML 中对齐文本，请使用style 属性来定义 CSS text-align 属性。请记住，使用 style 属性会覆盖全局设置的任何样式。它会覆盖在 HTML <style> 标签或外部样式表中设置的任何样式。

HTML style 属性为元素指定内联样式。该属性与 HTML <p> 标签一起使用，并使用 CSS text-align 属性进行居中、左对齐和右对齐。HTML5 不支持<p> 标签的 align 属性，因此使用 CSS 样式来设置文本对齐。

文本的不同对齐方式

文本对齐示例

以下示例将说明文本的不同对齐选项。

将文本居中对齐

在此示例中，我们将创建两个段落元素，并将第二个段落元素对齐到屏幕的中心。

<!DOCTYPE html>
<html>
   <body>
      <strong>Default Aligned Text</strong>
      <p>TutorialsPoint</p>
      <strong>Center Aligned Text</strong>
      <p style="text-align:center;">TutorialsPoint</p>
   </body>
</html>

将文本右对齐

在此示例中，我们将创建两个段落元素，并将第二个段落元素对齐到屏幕的右侧。

<!DOCTYPE html>
<html>
   <body>
      <strong>Default Aligned Text</strong>
      <p>TutorialsPoint</p>
      <strong>Right Aligned Text</strong>
      <p style="text-align:right;">TutorialsPoint</p>
   </body>
</html>

将文本左对齐（默认）

在此示例中，我们将创建两个段落元素，并将第二个段落元素左对齐。但默认对齐方式也是左对齐的。

<!DOCTYPE html>
<html>
   <body>
      <strong>Default Aligned Text</strong>
      <p>TutorialsPoint</p>
      <strong>Left Aligned Text</strong>
      <p style="text-align:left;">TutorialsPoint</p>
   </body>
</html>
您也可以使用 HTML dir 属性来设置对齐方式，但如果在末尾或开头有任何特殊字符，它将不起作用。此属性用于设置方向。

更新于： 2024年8月22日

232K+ 次观看

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告