Question

Recentley试图制作一个带有css的spritesheet和一些图标类。并发现css类不适用于后台位置，但ID现在可以解释为什么会这样做。

我的实际代码。我快速输入了我的问题并为此犯了一些错误。

这不起作用

.male {
    height: 286px;
    width: 110px;
    background-position: 0px 0px;
}

.defender {
    background: url('../images/classes/human_defender.png');
}
<div class="male defender"></div>

但是，当我将icon1更改为id时，它确实可以正常工作

#male {
    height: 286px;
    width: 110px;
    background-position: 0px 0px;
}

.defender {
    background: url('../images/classes/human_defender.png');
}
<div class="defender" id="male"></div>

Answer 1

尝试将url放入图像的路径。

.class {
  background-image:url('path-to-image/image.png');
}

正如你所说，第二种选择适合你。你能提供他们的jsfiddle例子吗？因为我的观点也无法发挥作用。

Answer 2

.class {
url('backgroundimageurl');
}

应该是

.class {background-image:url(backgroundimageurl);}

Answer 3

在你的css .class类中有错误的背景属性。请尝试background-image:url取代url。

＆＃13;

.class {
  background-image:url('http://www.hdwallpapersos.com/wp-content/uploads/2015/02/nature-wallpapers-natural-green-wallpaper-wallpaper.jpg');
}

.icon1 {
  background-position: 32px 0px;
  width: 100px;
  height: 100px;
}

＆＃13;

<div class="class icon1"></div>

＆＃13;

CSS背景 - 位置不在.class中工作

3 个答案: