子元素多行文字如何垂直居中显示？

IT行业相对于一般传统行业，发展更新速度更快，一旦停止了学习，很快就会被行业所淘汰。所以我们需要踏踏实实的不断学习，精进自己的技术，尤其是初学者。今天golang学习网给大家整理了《子元素多行文字如何垂直居中显示？》，聊聊，我们一起来看看吧！

如何在子元素多行文字的情况下，垂直居中显示

对于这样的问题：“

这种情况下，子元素多行文字如何垂直居中？

  
  
  
  


  
<div class="box1">1234aaaaaaaaaaaaaaaaaaaaa</div>

可以采用以下解决方案：

.box1 {
  display: flex;
  align-items: center;
  word-break: break-all;
}

通过设置 display: flex; align-items: center; 可以让子元素垂直居中。

而 word-break: break-all; 则可以使字母数字间进行换行，从而实现多行文字的垂直居中显示。

到这里，我们也就讲完了《子元素多行文字如何垂直居中显示？》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！