...照旧在HTML布局中的图片都市孕育发生HTTP恳求,前端优化的第一条便是淘汰恳求数,最直接有用的要领是利用图片精灵(CSS Spirit)。图片精灵便是把很多图片放到一张大图片内里,经由过程CSS来表现图片的一部门。
基于28个网页-相关网页
下面是两个图片精灵,一个是Google的,一个是我的。
Below are two image sprites - one from Google and one from me.
使用图片精灵是在你尽可能地使用其他的优化策略后最后的一招。
Using image sprites is sort of a last resort after you have done as much as you can with other optimization techniques.
有了图片精灵,你将要用CSS选择器对每个只显示精灵中部分图片的链接进行处理:只要你需要的那部分。
With image sprites, you will have CSS selectors for each link that display only a portion of the image Sprite - effectively showing just the image you need.
应用推荐