css sprite 看起来与背景图片不同

Question

我有两种调用图像的方式

<table width="100%" height="81" border="0" cellpadding="0" cellspacing="2" background="thefolder/userbg.gif"> by using the background element in css

或者通过调用 sprite 和使用 css 类这种方式

.userbg{
    background-position: -460px -2px ;
    width: 180px;
    height: 81px;
}

还有这样的东西

<table width="100%" height="81" border="0" cellpadding="0" cellspacing="2" class="userbg"> 

然而，当我使用背景标签时，它似乎有一个额外的长度，并且与 css 类相比被拉长了一点，关于为什么会发生这种情况的任何原因？我检查了尺寸，它们都是一样的

Answer 1

(这应该是一个评论，但它更长，所以我把它作为一个答案发布。)

几个问题:

• background="thefolder/userbg.gif" 不是 CSS，而是 HTML。
• 您不必“必须”使用 CSS Sprite 。为什么不像第一个示例那样只使用“普通”背景图像？
• 在您的 Sprite 示例中，您具有相互矛盾的属性。在 CSS 中你写 width: 180px; 但在 HTML 中你有 width="100%"。您不能同时拥有两者 - 除非 100% 宽度恰好导致宽度为 180 像素，但这仍然是个坏主意。
• 与其他元素不同，表格上的 width 和 height 仅被视为建议。浏览器很有可能会更改大小，以适应表格的内容。
• 这些图片并没有多大帮助。差异可能是因为您以不同方式裁剪它们。