使用CSS实现文字在图片中居中显示对于一张图片,在图片上方或下方添加文字是非常普遍的。但是,如果希望文字准确地居中显示在图片上,该怎么做呢?本文将介绍如何使用CSS实现文字在图片上居中显示。首先,我们
.parent { position: relative; }
.child { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.parent { position: relative; } .child { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
<div class="parent"> <img src="example.jpg"> <p class="child">这是一段需要居中的文字</p> </div>
粉丝
0
关注
0
收藏
0