我在单个 sprite 图像中包含页面上的许多图像，由于网站的其他要求，这些图像必须包含在单个 sprite 中。
虽然这在大多数浏览器中工作正常，但我在 Opera Mini 上遇到了一个问题，它根本不渲染 Sprite ，只显示整个图像。
是否有任何 CSS 可用于在浏览器无法呈现 Sprite 时提供替代文本？
最佳答案
有点迷茫。 Sprite 不渲染但显示整个图像？您是一次看到所有 Sprite ，还是一个也没有？
您可以对 opera mini(以及渲染未按预期工作的任何其他移动浏览器)使用浏览器检测。
将所需的文本添加到 sprite 元素，并使用大的负文本缩进来隐藏内容。
为不支持的浏览器禁用缩进和背景图像。
所有浏览器.css
div.sprite {
width:20px;
height:20px;
background:transparent url(img/mysprites.gif) no-repeat scroll top left;
overflow:hidden;
text-indent:-5000px;
}
#first_sprite {
background-position:20px 40px;
}
移动浏览器.css
div.sprite {
background-image:none;
text-indent:0;
}
页面
<div id="first_sprite" class="sprite">Alternate text</div>
关于css - Sprite 回退，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2613247/