Css 是否将div放置在图像的顶部？

我想知道是否有可能在图像上放置一个div。我查了一下，很明显它应该可以工作，我尝试了一些使用额外容器和z-index的方法，但当我这样做时，似乎什么都不起作用。我现在有这个，但我的文本div应该在图片的顶部，只是在一些奇怪的地方浮动

<a href="portfoliodetail.php?id=<?=$id?>" title="<?=$title?>">
    <div class="latestWorkTitle"><?=$title?></div>
    <img src="images/portfolio/thumbnails/<?=$bgthumbnail?>" alt="<?=$title?>" class="noMargin" />
</a>

<style>
    latestWork a img {
        max-width: 28%;
        height: auto;
        margin-right: 7%;
        position: relative;
        float: left;
        z-index: 5;
    }

    .latestWorkTitle {
        width: 100px;
        height: 20px;
        position: relative;
        z-index: 10;
    }
</style>

最近的工作{
最大宽度：28%；
高度：自动；
保证金权利：7%；
位置：相对位置；
浮动：左；
z指数：5；
}
.最新作品名称{
宽度：100px；
高度：20px；
位置：相对位置；
z指数：10；
}

你的

a

需要有

位置：相对的

，然后它的孩子有

位置：绝对的

我知道这不正是你想要的解决方案，但是为什么不试着将图像作为div的

背景图像

，如下所示：

.selector {
  background-image: url('../img/img.png');
}

---

如果您试图使用PHP动态地执行此操作，则可以将CSS文件保存为.PHP文件，并包括变量名。这似乎是一个更简单的选择。

嘿，谢谢你的主意。我已经试过了，但不幸的是，我当时遇到了这个问题。