[分享]css中如何让文本居中

在CSS中，我们经常会遇到需要让文本居中显示的情况，如何实现呢？下面就让小编来为大家介绍一下。 首先，我们需要使用p标签来包围我们要居中显示的文本。然后，我们可以通过设置p标签的textalign属性...

在CSS中，我们经常会遇到需要让文本居中显示的情况，如何实现呢？下面就让小编来为大家介绍一下。 首先，我们需要使用p标签来包围我们要居中显示的文本。然后，我们可以通过设置p标签的text-align属性来让文本水平居中显示。代码如下：

这是要居中显示的文本

如果我们想要让文本垂直居中显示，可以使用行高的方式来实现。代码如下：

这是要垂直居中显示的文本

此外，如果我们要让文本既水平又垂直居中显示，可以将上面两种方法结合起来使用。代码如下：

这是既水平又垂直居中显示的文本

另外，如果我们需要将多个文本块居中显示，也可以使用div标签来包围这些文本块，然后通过设置display属性为“flex”和align-items属性为“center”来实现。代码如下： 最后，为了展示以上的代码，我将代码放在pre标签中：

<p style="text-align:center;">这是要居中显示的文本</p>
<p style="height: 100px; line-height: 100px; text-align: center;">这是要垂直居中显示的文本</p>
<p style="height: 100px; line-height: 100px; text-align:center;">这是既水平又垂直居中显示的文本</p>
<div style="display: flex; align-items: center;">
  <p>居中显示的文本1</p>
  <p>居中显示的文本2</p>
</div> 

以上就是关于如何让文本居中显示的介绍，希望对大家有所帮助。