如何实现 多行文本 且 行数不确定 多个盒子 且 盒子个数不确定 水平垂直居中

问题描述：如何让一段行数不定的文本在一个div中水平垂直居中

	<style>
        .box1{
            position: relative;
            width: 300px;
            height: 300px;
            background-color: #cfa;
        }
        .box2{
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            background-color: #fac;
        }
    </style>
    <div class="box1">
        <div class="box2">
            我喜欢你丫
            我喜欢你丫
            我喜欢你丫
            我喜欢你丫
            我喜欢你丫
            我喜欢你丫
        </div>
    </div>

效果图：

总结：

• 借助box2，让box2在box1中水平垂直居中，那么box2中的文字自然也就在box1中水平垂直居中了

注意：

• 这里的box2是不定宽，不定高的，所以box2的居中方式，不能借助margin来实现。

拓展

• 根据上述原理，你同样也可以实现使多个盒子水平垂直居中在某个div中