css如何实现长文本自动换行并且水平垂直居中

本文主要讲解关于css如何实现长文本自动换行并且水平垂直居中相关内容，让我们来一起学习下吧！

以下是一个html结构，一个div盒子中包裹着一个a标签文本

<div class=\"box1\">
<a href=\"\">欢迎访问潘子夜个人博客-www.panziye.com 这里有免费的学习资源和项目资源</a>
</div>

css结构，当文本超过div盒子高度的时候，用word-break: break-all;来实现自动换行

.box1 {
  width: 100px;
  height: 100px;
  border: 1px solid red;
  word-break: break-all;//实现超过宽度自动换行
  text-align: center;//水平居中
  display: flex;
  align-items: center;//实现垂直居中
}

以上就是关于css如何实现长文本自动换行并且水平垂直居中相关的全部内容，希望对你有帮助。欢迎持续关注潘子夜个人博客（www.panziye.com），学习愉快哦！