我有一个链接，由1个图像组成，没有别的。当用户将鼠标悬停在其上时，我还需要此图像以突出显示。我在想：使用<a>标签并在CSS中设置其高度，宽度和背景图像属性。但是，（我觉得它可能会这样做）<a>标记在浏览器中呈现时的大小为0x0。我可以在链接标记之间包含几个字符（图像显示确定），但感觉有点hacky。我也在考虑使用1px透明图像设置的正确尺寸的旧技巧 - 但这似乎也不是正确的做法。我也可以用jQuery做同样的事情（但这似乎试图用大锤杀死苍蝇）。
是否有另一种纯CSS / HTML方式来实现这一目标？
答案 0 :(得分：12)
将其设置为display:block;，默认情况下，标记设置为内联显示。然后，您可以设置宽度和高度。
通过更改悬停时的背景位置或更改背景图像，您可以进行翻转。
答案 1 :(得分：1)
对于背景图片，您应该使用sprite map。这意味着制作一个大图像，其中包含您要显示的每个图像，并仅显示其中的一部分作为背景。这样做真的很好，因为它预先加载了悬停的图像，因此用户没有任何延迟。我还发现它稍微组织了我的图像目录（而不是每个按钮都有一个开/关图像我只有一个图像）