html - 如何在背景图片下显示文字？

Question

我正在创建一个网站，其中包含三个 <li>都向左浮动，并且每个都有特定图像的背景。我在每个 <li> 中都有文字我想移动该文本，使其显示在背景下而不是在背景上。这种布局的 css 是什么？

下面是我想要的布局示例。感谢您的帮助。

====== ====== ======
| | | | | |
| | | | | |
====== ====== ======
文本 文本 文本

我没有 ASCII 艺术技能，但希望你能理解。

Answer 1

将 margin-top 中的文本设置为等于背景图像的高度。跨度需要是 display: block 才能工作。或者，更好的是，将 padding-top 设置为等于背景图像的高度，使用 background-image-repeat: no-repeat。

参见 http://jsfiddle.net/77NdE/一个工作示例。