Question

我在我的代码中使用content:"";并且我的链接停止工作，如果我删除它，那么我的图像将消失。我该如何解决这个问题？

.content_wrapper::after
{
    background-image: url('../images/image.png');
    background-position-x: 95px;
    background-position-y: 155px;
    background-repeat: no-repeat;
    background-size: 130px;
    bottom: 0;
    content: " ";
    left: 0;
    opacity: 0.4;
    position: absolute;
    right: 0;
    top: 0;
}

它确实覆盖了主要内容，但是如果我使用z-index它可以工作，但是文本在我的图像之上，有没有办法正确设置我的图像，仍然可以使我的链接工作？

Answer 1

如果没有你发布你的完整代码很难看到最新情况，但是从我所看到的元素位置绝对和所有位置值设置为0.这会导致元素展开以适应宽度和高度最近的相对定位父母的。

因此，它可能会扩展到正文的整个宽度和高度，并覆盖页面上的所有链接，而与内容样式完全无关。

如果您可以发布您的代码以及您想要实现的目标，那么也许我可以帮助您进一步

编辑：如果你添加

，看起来这就是问题所在

指针事件：无;

到元素的css，它允许您点击div到下面的内容。它有很好的浏览器支持，请参阅此处http://caniuse.com/#feat=pointer-events

为了让它与IE很好地配合你需要将这个IE条件代码添加到CSS

filter：progid：DXImageTransform.Microsoft.AlphaImageLoader（src =＆＃39; your_transparent.png＆＃39;，sizingMethod =＆＃39; scale＆＃39;）; 背景：无！重要;

只要您不需要点击.content_wrapper ::

之后的内容，这将有效。

Answer 2

我非常确定@jacksaundersdesign是对的，如果可以的话，我建议您在:after部分使用单个冒号，让IE8按照您的意愿执行（它没有＆＃39;使用双冒号：see Chris Coyler's explanation）

我放了＆＃34;我的链接停止了工作。内容：＆＃34;＆＃34; ; ＆＃34;在我的CSS代码中

2 个答案: