Question

我跟随Css，我使用了背景图像。然后我生成Anchor并分配具有图像的css类。它适用于IE，但不适用于Safari，Firefox和Chrome。

任何人都可以帮我解决问题。我在下面提供了详细信息。

CSS

.HOME
{
   BACKGROUND-IMAGE: url(../images/home.jpg);
   WIDTH: 56px;
   BACKGROUND-REPEAT: no-repeat;
   HEIGHT: 20px
}
.HOME A
{
   WIDTH: 56px;
   HEIGHT: 20px
}
.HOME A:hover
{
   BACKGROUND-IMAGE: url(../images/home1.jpg);
   WIDTH: 56px;
   HEIGHT: 20px
}

HTML 的

<td class="HOME"><A href="#abc.html" Class ="Home" onclick="OpenPage()"/></td>

Answer 1

background-image正在被弃用，我建议使用：

a.home { background: url(../images/home.jpg) no-repeat; width:56px; height:20px }
a.home:hover { background: url(../images/home1.jpg); width:56px; height:20px }

Answer 2

如果您使用以下CSS，它会起作用：

a.home { background-image:url(../images/home.jpg); width:56px; background-repeat:no-repeat; height:20px }
a.home:hover { background-image:url(../images/home1.jpg); width:56px; height:20px }

Answer 3

我尝试做类似的事情并发现添加位置：相对或绝对使其适用于Chrome / Safari / Firefox。

Anchor的背景图象不与Safari / Firefox一起使用

3 个答案: