asp.net - 我应该将这些图像变成 Sprite 吗？如果是，我会怎么做？ (含图片)

Question

我有一个带有客户页面的 asp.net (vb) 网站。在该页面上，有我们一些大客户的超链接 Logo 。每个 Logo 的尺寸相同(宽 207 高 119)。图片有 3 列 5 行，总共 15 个 Logo 。

目前，图像的编码如下 - 但我想我需要删除 asp 图像并仅使用常规图像:

<td>
<asp:HyperLink ID="HyperLink15" runat="server" ImageUrl="~/images/clgm.jpg" 
NavigateUrl="http://www.gm.com" Target="_blank"    
itemprop="url">HyperLink</asp:HyperLink>
</td>
<td>
<asp:HyperLink ID="HyperLink16" runat="server" ImageUrl="~/images/clford.jpg" 
NavigateUrl="http://www.ford.com" Target="_blank" 
itemprop="url">HyperLink</asp:HyperLink>
</td> 

对于所有 15 个客户端，依此类推。速度和性能会更好吗(如果我将这些图像拆分成一张图像，通过减少http请求？假设是这种情况，我应该将这些asp:hyperlinks和asp:images更改为常规的html链接和图像 ？然后我如何 Sprite 它们？我不太擅长CSS，所以我真的很感激任何人在这方面提供的任何帮助。

如果需要，下面是它们的样子——同样，3 列和 5 行(这就是我更困惑的地方):

Answer 1

是的， Sprite 很好。在我看来，拥有 Sprite 图像是大部分工作。

您现在可以使用一些 CSS 来访问您的 Sprite 。请参阅此处的工作示例。 http://jsfiddle.net/DWy2W/

<style>
.sponsor{
    width:80px;
    height:50px;
    background-image: url(/image/m93cd.jpg);
}
.gm{
    background-position: 0px 0px;
}
.ford{
    background-position: -80px 0px;
}
.osi{
    background-position: -80px -50px;
}​
</style>
<a href="http://www.ford.com">
    <div class="sponsor ford"></div>
</a>
<a href="http://www.gm.com">
    <div class="sponsor gm"></div>
</a>
<a href="http://www.osi.com">
    <div class="sponsor osi"></div>
</a>​