css如何让换行的文字也垂直居中?

Question

<div id="box">
    <div>
        文字1
        <br/>
        文字2
    </div>
</div>

box需要设置固定的高度，因为有背景图片，现在想让文字垂直居中。

1.不能设置行高，因为换行的话间隔会很大。

2.不能设置padding，否则背景图片有问题。

Answer 1

方案一： flex

方案二： line-height

方案是可以的，只不过需要重置一下。line-height: initial;

刚才加了个边框，发现并不是居中的。我排查一下。

方案三： absolute 定位

方案四：grid

---

方案太多了，就先这样吧。