CSS 实现HTML/XHTML文本区域的文本对齐

在本文中，我们将介绍如何使用CSS在HTML/XHTML文本区域中实现文本对齐的效果。文本对齐是指将文本在容器中水平对齐的方式，可以使文本在容器中居中、靠左或靠右。

阅读更多：CSS 教程

居中对齐文本

要居中对齐文本，我们可以使用text-align属性。这个属性可以接受以下几个值：

对于一个HTML/XHTML文本区域的例子，我们可以使用以下CSS代码将其中的文本居中对齐：

textarea {
  text-align: center;
}

接下来是一个示例，其中使用了一个<textarea>元素作为HTML/XHTML文本区域，其中的文本将会居中对齐：

<textarea rows="4" cols="50">
这是一个文本区域，其中的文本将会居中对齐。
</textarea>

运行以上代码，我们可以看到文本区域中的文本被自动居中对齐显示。

要将文本靠左对齐，我们可以使用text-align属性并将其值设置为left。以下是一个将文本靠左对齐的示例：

textarea {
  text-align: left;
}

接下来是一个示例，其中的文本将会靠左对齐：

<textarea rows="4" cols="50">
这是一个文本区域，其中的文本将会靠左对齐。
</textarea>

运行以上代码，我们可以看到文本区域中的文本被靠左对齐显示。

要将文本靠右对齐，我们可以使用text-align属性并将其值设置为right。以下是一个将文本靠右对齐的示例：

textarea {
  text-align: right;
}

接下来是一个示例，其中的文本将会靠右对齐：

<textarea rows="4" cols="50">
这是一个文本区域，其中的文本将会靠右对齐。
</textarea>

运行以上代码，我们可以看到文本区域中的文本被靠右对齐显示。

要将文本两端对齐，我们可以使用text-align属性并将其值设置为justify。以下是一个将文本两端对齐的示例：

textarea {
  text-align: justify;
}

接下来是一个示例，其中的文本将会两端对齐显示：

<textarea rows="4" cols="50">
这是一个文本区域，其中的文本将会两端对齐。
</textarea>

运行以上代码，我们可以看到文本区域中的文本被两端对齐显示。

在本文中，我们介绍了如何使用CSS实现HTML/XHTML文本区域中的文本对齐效果。通过设置text-align属性的不同值，我们可以实现文本的居中、靠左、靠右或两端对齐。请根据自己的需要选择最适合的文本对齐方式。通过合适的文本对齐，可以使文本在容器中更加美观和易读。