html - 在顶部图像的 DIV 内添加文本

Question

我试图在图像顶部的 Div 中心添加文本“Post”，但它添加在图像旁边:

HTML:

<div id="Post">
    <span  class="Post">Post
        <img src="images/ask_post.png" />
    </span>
</div>

CSS:

#Post {
    position:absolute;
    background-image:url('../images/ask_post.png') no-repeat;
    left:741px;
    top:157px;
}

Answer 1

首先从 div 元素中删除图像，文本不会位于该图像之上，只有背景。其次，玩转 background properties直到它看起来像你想要的那样。

我的猜测是您需要调整 background-size或 background-position .

<div id="Post">
    <span  class="Post">Post</span>
</span>

查看 background-size:cover; 是否是您需要的。您可能还需要调整 div 的 height 和 width 以获得您想要的内容。