html - 新行中的 Css 背景图像和文本

Question

我在将文本放置在背景图片下方时遇到问题，我确实玩过 CSS，但不幸的是文本没有移动到图片下方的下一行。

这是我的 HTML

    <a class="bgimg">placing text below background image </a>
    .bgimg{
    background-image: url('images/HBR_compact_black_text_red_shield65x31.png');
    background-repeat:no-repeat;
     }

我想在顶部有背景图片，在图片下方有文字。

有人可以给我建议吗？

Answer 1

关键是在顶部填充，所以你需要:

padding-top: 20px;

此外，由于它是默认内联的 anchor ，因此您需要将其设置为 inline-block(将其设置为 block 可能会导致文本流问题):

display: inline-block;

就是这样，看这里的例子:http://jsfiddle.net/2Log20b4/