css图像背景同时使用位置和拉伸

我正在创建一个头像列表，供我的用户在我的网站上选择。化身在一个大图像中，每行5个子图像，每列5个子图像。因此，通过使用图像背景位置，我可以显示25种可能的选择之一。例如，我的子图像大小为160X160，我想显示第3行第2列。css将是

<img class="avatar-icon img-thumbnail" style="background-position: -160px -320px; background-image: url('/images/logos/Avatar_0.png')">

它工作得很好。然后我发现在某些情况下，化身有点大。我想在定位后拉伸背景。在上面的示例中，我仍然希望显示从（-160px，-320px）到（-320px，-480px）的区域。但我想把它扩展到50%，所以imag的大小将是80x80。我尝试了背景参数，但没有找到一个好的组合。有没有一种css方法可以做到这一点？（无需将大图像复制为50%的小图像）

使用

或

作为背景属性，而不是应用于图像标记

您可以通过两种方式实现化身缩放：

1） 通过缩放位置参数和图像大小，即

背景位置：-80px-160px；背景尺寸：50%自动

2） 如果不想更改位置参数，只需使用transform属性进行缩放即可。

变换：比例（0.5）
使用
或
作为背景属性，而不是应用于图像标记

您可以通过两种方式实现化身缩放：

1） 通过缩放位置参数和图像大小，即

背景位置：-80px-160px；背景尺寸：50%自动

2） 如果不想更改位置参数，只需使用transform属性进行缩放即可。

变换：比例（0.5）
谢谢。我刚刚试过，但用span无法解决。Span本身无法保持定义的大小，除非其中有文本等内容。@Chris要使用
，您需要为其指定
显示：内联块开始工作。谢谢。我刚刚试过，但用span无法解决。Span本身无法保持定义的大小，除非其中有文本等内容。@Chris要使用
，您需要为其指定
显示：内联块开始工作。