如何实现任意大小图片和多行文字的水平垂直居中显示？

本文共计3225个文字，预计阅读时间需要13分钟。

想要让单行文字在高度固定的容器内垂直居中，可以使用以下CSS代码：

css.container { height: 100px; /* 容器高度 */ display: flex; align-items: center; /* 垂直居中 */ justify-content: center; /* 水平居中，可选 */}

对于多行文字在高度固定的容器内垂直居中，可以使用以下CSS代码：

css.container { height: 100px; /* 容器高度 */ display: flex; align-items: center; /* 垂直居中 */ flex-direction: column; /* 文字垂直排列 */}

这样，无论是单行还是多行文字，都可以在高度固定的容器内实现垂直居中。

想必写css的都知道如何让单行文字在高度固定的容器内垂直居中，但是您知道或者想过让行数不固定的文字在高度固定的容器内垂直居中呢？本文将会告诉你如何实现多行文字的垂直居中显示。

关于图片垂直居中显示，想必很多写css的人都研究过，或者说是搜寻过方法。