html文本对齐两端对齐_如何在HTML中对齐文本?

《html文本对齐两端对齐_如何在HTML中对齐文本?》

html文本对齐两端对齐

HTML and CSS provide different ways in order to align text. Text alignment is simply providing the location or site of the given text. Text alignment generally provides some direction like right , center ,left etc.

HTML和CSS提供了不同的方式来对齐文本。 文本对齐只是提供给定文本的位置或位置。 文本对齐通常提供一些方向,例如rightcenterleft等。

Text alignment can be done by using mainly the CSS text-align attribute which is explained below in detail. Also <p> tag align attribute, <div> tag align attribute and <center> tag can be also used for specific alignment purposes.

可以通过主要使用CSS text-align属性来完成文本对齐,下面将详细说明。 <p>标签的align属性,<div>标签的align属性和<center>标签也可以用于特定的对齐目的。

使用text-align CSS属性对齐文本 (Align Text with text-align CSS Attribute)

The most popular method for text alignment is using the text-align attribute of the CSS. Most of the text related to HTML tags like headers, paragraphs, etc. provide the text-align CSS attribute.

文本对齐最流行的方法是使用CSS的text-align属性。 与HTML标签相关的大多数文本(例如标题,段落等)都提供text-align CSS属性。

将文字右对齐与文字对齐 (Align Text Right with text-align)

We will start by aligning the text to the right. We will use the text-align:right like below.

我们将首先在右边对齐文本。 我们将使用text-align:right如下所示。

<html>
<body>

<h1 style="text-align:right;">Right Aligned Heading1</h1>
<h2 style="text-align:right;">Right Aligned Heading2</h2>
<p style="text-align:right;">Right Aligned Paragraph Text.</p>
<div style="text-align:right;">Right Aligned Div Text</div>

</body>
</html>

《html文本对齐两端对齐_如何在HTML中对齐文本?》 Align Text Right with text-align 将文字右对齐与文字对齐

将文本中心与文本对齐(Align Text Center with text-align )

We can center different HTML tags like h1, h2, div or p like below by using text-align CSS attribute for them.

我们可以通过使用text-align CSS属性将不同HTML标记(例如h1,h2,div或p)居中,如下所示。

<html>
<body>

<h1 style="text-align:center;">Centered Heading1</h1>
<h2 style="text-align:center;">Centered Heading2</h2>
<p style="text-align:center;">Centered Paragraph Text.</p>
<div style="text-align:center;">Centered Div Text</div>

</body>
</html>

《html文本对齐两端对齐_如何在HTML中对齐文本?》

文本左对齐与文本对齐 (Align Text Left with text-align )

In the following example, we will align the given header, paragraph, and div to the left.

在下面的示例中,我们将给定的标题,段落和div对齐到左侧。

<html>
<body>

<h1 style="text-align:left;">Left Aligned Heading1</h1>
<h2 style="text-align:left;">Left Aligned Heading2</h2>
<p style="text-align:left;">Left Aligned Paragraph Text.</p>
<div style="text-align:left;">Left Aligned Div Text</div>

</body>
</html>

《html文本对齐两端对齐_如何在HTML中对齐文本?》 Align Text Left with text-align 文本左对齐与文本对齐

将文本与<p>对齐属性(Align Text with <p> align Attribute )

<p> is the paragraph HTML tag used to create text paragraph. The text paragraph can be aligned with the align attribute and right ,center , left values like below.

<p>是用于创建文本段落的段落HTML标记。 文本段落可以与align属性和rightcenterleftalign ,如下所示。

<html>
<body>

<p align="left">Left Aligned Paragraph Text.</p>

<p align="center">Center Aligned Paragraph Text.</p>

<p align="right">Right Aligned Paragraph Text.</p>

</body>
</html>

《html文本对齐两端对齐_如何在HTML中对齐文本?》 Align Text with <p> align Attribute 将文本与<p>对齐属性

使文本与<div>对齐属性(Align Text with <div> align Attribute )

The div tag can be used to align text. The align attribute is used to align to right, center, left like below.

div标签可用于对齐文本。 align属性用于将右,中,左对齐,如下所示。

<html>
<body>

<p align="left">Left Aligned Div Text.</p>

<p align="center">Center Aligned Div Text.</p>

<p align="right">Right Aligned Div Text.</p>

</body>
</html>

《html文本对齐两端对齐_如何在HTML中对齐文本?》 Align Text with <div> align Attribute 使文本与<div>对齐属性
LEARN MORE  HTML Bold Tag Usage and Examples 了解更多HTML粗体标记的用法和示例

翻译自: https://www.poftut.com/how-to-align-text-in-html/

html文本对齐两端对齐

    原文作者:cunjiu9486
    原文地址: https://blog.csdn.net/cunjiu9486/article/details/109072617
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞