Html 使用css和两幅图像进行灰度悬停

我已经尝试过这个代码，但出于某种原因，它对我不起作用。我正在关注这个已经发布的链接。（仅CSS，使用两组图像（灰度和彩色）。你能告诉我为什么这对我不起作用吗？我给了我的图像一个id，我把它放在CSS中的网站为什么不起作用？这是我的html和CSS代码。 html

谢谢.AG

好吧，当我点击时，我得到一个404错误，这意味着服务器找不到图像

此外，您没有#on缩略图#fgm。当您使用#时，它表示您使用的id。它表示类，因此您调用CSS的标记也需要反映这一点

通常，当我制作背景图像时，我不会从外部源中提取。我从服务器的目录中提取。这样我可以控制图像。在这种情况下，您将使用相对URL而不是绝对URL

比如：

#thumbnail_fgm { background: url(img/thumbnail_fgm_bw.jpg);} 

或者如果img目录在CSS目录下

#thumbnail_fgm { background: url(../img/thumbnail_fgm_bw.jpg);}

或者如果是别的地方，我会的

#thumbnail_fgm { background: url(/<whereever it is>/img/thumbnail_fgm_bw.jpg);}

#缩略图fgm{background:url（//img/thumbg_fgm_bw.jpg）}

该地址似乎不存在图像。您是否可以发布附加这些类的标记的html。在html代码中，您是否没有关闭锚定标记，或者是Ctrl C+V错误？？）

#thumbnail_fgm { background: url(../img/thumbnail_fgm_bw.jpg);}

#thumbnail_fgm { background: url(/<whereever it is>/img/thumbnail_fgm_bw.jpg);}