Question

我有一个愚蠢的小问题。似乎CSS背景图像属性不起作用。

图像位于背面的DIV容器中，我认为可能会干扰它，但在删除后，它仍然无法正常工作（目前已删除）
我已尝试将css代码放在不同的类中，但仍无法正常工作
我已确定该图片与html＆amp;的目录相同css文件。

HTML

<div class="detail_below">

<div class="course-downloadPF">
<a class="thickbox" href="http://www.google.com">Project Files Included</a>
</div>

<div class="course-add2PL">
<a class="thickbox" href="http://www.google.com">Add Course <br />to Playlist</a>
</div>

<div class="course-add2Favorite noMargin">
<a class="thickbox" href="http://www.google.com">Add to <br />Favorite</a>
</div>
  </div>

CSS

.course-downloadPF a,
.course-add2PL a,
.course-add2Favorite a,
.course-removeFavorite a {

    width:80px;
    height:40px;
    font-size:11px;
    color:#fff !important;
    line-height:1.1em;
    text-align:center;
    text-decoration:none;
    padding-top:40px;
    background:url (sprite-courseDetails.gif) 0 0 no-repeat;
    margin-right:10px;
    display:block;
    float:left;
    border-radius: 4px;
}


.course-add2PL a {
    background:url (sprite-courseDetails.gif) -80px 0 no-repeat;
}
.course-add2Favorite a {
    background:url (sprite-courseDetails.gif) -160px 0 no-repeat;
}
.course-removeFavorite a {
    background:url (sprite-courseDetails.gif) -240px 0 no-repeat;
}

如果有人可以看一看，并给予第二意见，我会确定它是一种小而愚蠢的东西，我会忽略它。

Answer 1

    .course-add2PL a {
        background: url('sprite-courseDetails.gif') -80px 0 no-repeat;
    }
    .course-add2Favorite a {
        background: url('sprite-courseDetails.gif') -160px 0 no-repeat;
    }
    .course-removeFavorite a {
        background: url('sprite-courseDetails.gif') -240px 0 no-repeat;
    }

Answer 2

删除url和方括号(...)

之间的空格

这是无效的：

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

但这是：

.course-add2PL a {
    background: url(sprite-courseDetails.gif) -80px 0 no-repeat;
}
.course-add2Favorite a {
    background: url(sprite-courseDetails.gif) -160px 0 no-repeat;
}
.course-removeFavorite a {
    background: url(sprite-courseDetails.gif) -240px 0 no-repeat;
}

Answer 3

设置背景图片，而不是背景.... background-image:url('sprite-courseDetails.gif');

Answer 4

你的问题不是背景css本身。您在CSS文件中有解析错误，无法呈现超出该错误的所有css。见第214行：

*letter-spacing: -0.01em; /* IE 7 and below */

Asterisk不正确。还有其他一些需要解决的解析错误。

您可能希望使用http://jigsaw.w3.org/css-validator

等工具检查此文件

Answer 5

除非我失明，否则我不认为你在任何连接到你网页的css文件中定义了这些样式。我能看到的唯一的css文件是test.css，它不包含这些样式。

有几种方法可以定义样式，但以下内容应该可以使用

创建一个名为'whatever.css'的文件，并将上述样式粘贴到其中。

然后在html head元素中添加以下内容

<link media="screen" type="text/css" href="whatever.css" rel="stylesheet">

这会将您的页面链接到样式。

对不起，如果我误解了

永

Answer 6

好的，在你的CSS中，下面的样式没有右括号

.whiteCLR {
    color: #fff; /* White */

可能有更多错误，但修复了那个，然后我们会看到。

永

背景图像未显示在<div>容器</div>中

6 个答案: