Question

这段代码有什么问题？当我尝试边框式边框时，它是有效的。但它不适用于background-Image。

<!DOCTYPE html>
<head>
    <style type = 'text/css'>
    a.test:hover span{
        background-image: url('bearbeitenx.png');
    }

    //.test { background-image:url('unbenannt.png');}
    }
</style>
</head>
<body>


<a href = 'eerwerqwerwer' class = 'test'><span style = 'background-image: url(bearbeiten1.png); width:40px; height:40px; display: block; background-repeat: no-repeat;' ></span></a>
</body>
</html>

Answer 1

.bearbeiten1-png a:hover匹配悬停的锚元素，该元素是作为bearbeiten1-png类成员的元素的后代。

你没有这样的元素。

a.bearbeiten1-png:hover会匹配您的主播，但您可能仍然看不到差异，因为您的<img>元素可能会掩盖背景图片。

Answer 2

我想CSS选择器应该是a.bearbeiten1-png:hover。您当前的CSS正在将该悬停样式应用于a，该bearbeiten1-png是归类为{{1}}的元素的后代。这与HTML的结构不匹配。

Answer 3

DEMO：http://jsfiddle.net/gn5mfpww/3/

这适用于

a.bearbeiten1-png:hover{
    background-image:     url('http://www.galliano.cc/Test_seite/cms/uploads/bearbeitenx.png');
}

将图像向右移动，以查看背景图像是否正在形成。

没有图像变化 - css

3 个答案: