如何用flex實現(xiàn)文字在圖片上面且劇中？

讓文字所在的div的position變成absolute，兩個div就不會互相影響了。
這里水平垂直方向居中用到了flex定位

html部分：

<div class="content-item flex jc-center al-cneter bg-img margin-bottom-sm">
                
                    <img src="../images/discovery_1.jpg" class="bg-img">
                
                <div class="text">
                    南潯VR實景
                </div>
            </div>

css部分：

.text{
            font-size: 1.5625rem;
            color: rgba(255,255,255,0.75);
            font-weight: bold;
            position: absolute;
            /* 如何讓文字居中顯示在圖片上*/
        }

效果：

image.png