我将一组图标合并到一个.png文件中，并使用css background-position在页面上显示这些图标，因为img标记会产生更多的http请求。
但是，我需要显示2种不同尺寸的每个图标：20x20,60x60。如何在不创建2个单独的.png文件（20x400和60x1200）的情况下执行此操作？
我知道用于缩放背景图像的background-size属性，但它在css3中引入，IE在9.0之前不支持它。
是否可以不使用背景大小？
答案 0 :(得分：1)
执行此操作的最佳方法是使用“字体图标技术” - 您可以在网络上阅读所有相关信息。当您需要兼容标记视网膜时，它也会有帮助
答案 1 :(得分：1)
由于出于兼容性原因无法使用背景大小，因此您可以尝试在同一图像中同时使用小版本和大版本的图标。如何对它们进行分组取决于您，但您应该进行一些测试，确定图像尺寸的增加是否仍会导致页面的可接受加载时间。
+1图标字体。你可以用它们做一些非常奇特的事情，例如： http://forecastfont.iconvau.lt/
答案 2 :(得分：0)
我认为你可以使用＆＃34;背景：尺寸＆＃34;属性。有了它，你可以在视觉上重新调整＆＃34;背景图片。
请查看here