是否可以将背景位置添加到 img /asp:image 标签

Question

我正在优化页面加载

我选择的第一个选项是 base64 转换

首页有18张小图需要加载由于 base64 是实际图像大小的 1.3 倍，因此我选择了图像精灵

拼接图像后，我可以用它来替换 background-image，background-position 替换 div，但我无法使用拼接图像来替换 img 和 asp:image 标签。我需要将它们设置为 <asp:image>，因为它附加了一些函数背后的代码

Answer 1

是的，你可以在图像上使用 sprite，关键点是在 src 上添加 height/width 和一个 empty/transparent 图像 1pixel x 1pixel 这样可以加载一些东西并显示图片标签之类的东西，因为没有有效的 src 浏览器可能会显示错误 img，或者什么都不显示

渲染结果可以是这样的：

<img class="rgoto" src="spacer.gif" height="9" width="8" >

风格：

img.rgoto {
background: url(sprite.gif) no-repeat -230px -20px;
height: 9px;
width: 8px;
}

Answer 2

您可以为所有 asp:Image 控件添加透明图像。它们将呈现为 HTML 图像。然后你应该确保你添加了正确的 css class 和每个适当的精灵。

请参阅 http://jsfiddle.net/9wo2mL32 中的示例。此外，确保将宽度和高度添加到 class（或 asp:Image 控件）：

<asp:Image ID="imgImage" runat="server" Height="100" Width="100" ...

是否可以将背景位置添加到 img /asp:image 标签

is it possible to add background position to img /asp:image tag

html

css

c#

asp.net

image