Question

假设我们要求图标元素需要在HTML中显示，因为我们需要为某些屏幕阅读器指示图标存在，并且最好让它们像IMG标签一样比我或普通DIV。

我们有sprite.png和empty.png张图片。 empty.png用于创建假空白图像（精灵图像将显示，因为它是我们元素的背景）。

在CSS中我们有课

.icon {
    background:url('sprite.png') 0px 0px;
    width:20px;
    height:20px;
}

然后我们在HTML中使用它：

<img src="empty.png" class="icon" alt="Image from Sprite is Shown" />

我们可以使用我们的'sprite.png'作为图像源，并使用css在img上设置任何遮罩/剪辑属性吗？

提前致谢。

Answer 1

background-image不会使用之后的0px参数。您可能会将其与background混合使用。

要显示精灵图像的正确部分，请使用background-position选择图像的正确部分。