html - 如何为不同大小的图标重用 css 背景 Sprite ?

标签 html css web css-sprites

我将一组图标合并到一个 .png 文件中,并使用 css background-position 在页面上显示这些图标,因为 img 标签会发出更多的 http 请求。

但是,我需要以 2 种不同的尺寸显示每个图标:20x20、60x60。如何在不创建 2 个单独的 .png 文件(20x400 和 60x1200)的情况下执行此操作?

我知道 background-size 属性可以缩放背景图像,但它是在 css3 中引入的,IE 9.0 之前不支持它。

是否可以不使用背景大小?

最佳答案

最好的方法是使用“字体图标技术”——您可以在网络上阅读所有相关内容。当您需要与视网膜兼容的标记时,它也很有帮助

关于html - 如何为不同大小的图标重用 css 背景 Sprite ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22982802/

相关文章:

javascript - 速记 http ://as//for script and link tags? 以前有人看到/使用过这个吗?

html - 从 FF 中的选择框中删除轮廓

html - 如何在不创建两条单独的行的情况下将 h3 与 p 对齐?

html - 像网格一样排列多个复选框。没有 table ?

jquery - 调整列大小时换行(Bootstrap)

javascript - 有没有办法防止网站文本被搜索到?

search - SEO网站别名优化

web - 托管您网站的几乎重复的 'test' 版本,而不会遭受 SEO 后果?

javascript - 如何在jquery自动完成中动态清除和添加源数据

javascript - 单击时切换按钮背景颜色