Question

我正在尝试定位图像，因此下半部分是一张图像顶部的倒数，但不知道该怎么做。

JsFiddle

图片本身看起来像this。

编辑：最终图片应该看起来像this.

Answer 1

查看此LINK。它可以解决你的问题。

Answer 2

您的CSS section.sep h3.top应为section.sep h4.top，因为您在HTML中使用了h4而不是h3

您的HTML：

<section class="sep">
    <h4 class="top company-tag">Pics</h4>
    <hr/>
    <h4 class="bottom company-tag">Map</h4>
</section>

Answer 3

您只需在 section.sep h4 中定义高度和行高现在按照你的要求工作正常......

<强> CSS

section.sep h4{
  background: url('http://i1200.photobucket.com/albums/bb328/tobeeornot/sec.png') no-repeat transparent;
  color:#fff;
  font-family:arial;
    font-size: 11px;
    font-weight: 400;
    height: 69px;
    letter-spacing: 1px;
    line-height: 50px;
    margin: 0 auto;
    text-align: center;
    text-transform: uppercase;
    width: 77px;

请参阅演示： - http://jsfiddle.net/JvnHn/7/

对齐图像/精灵以显示上半部分和下半部分

3 个答案: