到目前为止我已经见过很多次了,但我自己从未使用过。有人可以解释一下如何从这个单一的 png 图像中获取特定的图标图片,例如我使用 css 用红色选择的图标...
它被称作。它用于减少http请求。基本上所有图标都放置在单个画布上并用作background-image
属性,然后使用 CSS 进行映射background-position
财产,例如
.icon1 {
background-image: url('YOUR_URL_HERE');
background-position: 10px 10px; /* X and Y */
height: 30px;
width: 30px;
}
Demo http://jsfiddle.net/T2EtY/
简而言之,只需为您的元素定义一个固定的高度/宽度,然后使用映射画布background-position
财产。因此,如果页面上有 100 个小图标图像,它将向服务器发出 100 个请求,因此为了提高性能,使用了 CSS Sprites。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)