CSS精灵看起来不同，那么背景图像

问题描述：

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

或这种方式，通过调用一个精灵，并使用CSS类

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

和这样的事情

的2种方式

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

但是，它似乎当我使用背景标签它有一个额外的长度，并伸出了一点比较CSS类，为什么会发生这种情况的任何理由？我检查了尺寸和他们都一样

这可能是因为你正在设置宽度，但我不确定 – btevfik 2013-04-29 07:30:46

你可以发布链接的任何机会，比如jsFiddle？ – 2013-04-29 07:34:11

你好我张贴的图像来显示差异http://i40.tinypic.com/1r3mn6.png（与CSS类别 – user2328644 2013-04-29 07:38:09

答

（这应该是一个评论，但它的时间越长，所以我张贴作为一个答案。）

几个问题：

background="thefolder/userbg.gif"不CSS，但HTML。
你不必“使用CSS精灵”。为什么不只是一个“正常”的背景图像，因为你使用第一个例子？
在你的精灵例子中，你有矛盾的属性。在你写的width: 180px;的CSS中，但是在HTML中你有width="100%"。你不能同时拥有两个 - 除非100％的宽度恰好导致180像素的宽度，但它仍然是一个坏主意。
与表格上的其他元素width和height不同仅仅是建议。有一个很好的机会，浏览器改变大小，以便表格内容适合。
这些图像并没有真正的帮助。区别可能是因为你裁剪它们的方式不同。