相关疑难解决方法(0)

我正在尝试使用:before选择器将图像放在另一个图像上,但我发现它根本不能将图像放在img元素之前,只放置一些其他元素.具体来说,我的风格是:

.container
{
   position: relative;
   display: block;
}

.overlay:before
{
    content: url(images/[someimage].png);
    position: absolute;
    left:-20px;
    top: -20px;
}

我发现这很好用:

<a href="[url]" class="container">
  <span class="overlay"/>
  <img width="200" src="[url]"/>
</a>

但这不是:

<a href="[url]" class="container">
  <img width="200" src="[url]" class="overlay"/>
</a>

我可以使用一个div或p元素而不是那个span,并且浏览器正确地将我的图像覆盖在img元素中的图像上,但是如果我将叠加类应用于它img自身,则它不起作用.

我想让这个span有用,因为这会让我感到非常冒犯,但更重要的是,我有大约100篇我想要修改的博客文章,如果我可以修改样式表,我可以一次性完成但如果我必须返回并在span元素a和img元素之间添加一个额外的元素,这将是更多的工作.