Table 带有链接的精灵图像

Question

我正在尝试将具有 6 个链接图标的 table 替换为 6 个链接精灵图标，但 table 只是一个空白。这是代码的一部分 - 有什么想法吗？

HTML:

<table><tr>
    <td><a href="https://twitter.com/french_lkl"><div id="icon-twitter" height="35" width="35"></div></a></td>
    <td><a href="https://www.facebook.com/FrenchLanguage"><div id="icon-facebook" height="35" width="35"></div></a></td>
    </tr>
</table>

CSS:

#icon-twitter, #icon-facebook, #icon-gplus, #icon-pinterest, #icon-rss, #icon-newsletter{
background: url(socialmedia.png) no-repeat;
}

#icon-twitter{
background-position: 0 0;
width: 35px;
height: 35px;
}

#icon-facebook{
background-position: -36px 0;
width: 35px;
height: 35px;
}

Answer 1

尝试：

background: url('socialmedia.png') no-repeat;

Answer 2

您的图片不存在。

Failed to load resource: the server responded with a status of 404 (Not Found)

Table 带有链接的精灵图像

Table with linked sprite images

css

sprite