css中文本在框中间

在CSS中，许多开发人员面临的挑战之一是如何在框中间对齐文本。无论是标题、段落还是按钮，文本都需要在其容器中居中对齐，以使设计看起来更加完美。

.container{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100px;
  border: 1px solid black;
} 

要将文本垂直居中对齐，必须在容器中使用flex布局。这就意味着容器需要设置display属性为flex，并使用justify-content和align-items属性将文本水平和垂直居中。

例如：

h1{
  text-align: center;
  line-height: 100px; /*等于容器高度*/
} 

我们还可以通过设置文本的line-height来在容器中垂直居中对齐文本，但这个方法的局限性较大，只适用于单行文本。

总结来说，通过使用Flex和line-height属性，我们可以很轻松地在CSS中垂直和水平居中对齐文本。这将大大提高设计的视觉效果，并使网站更加专业和现代化。