[css] 为什么要使用css sprites?

haizhilin2013
2019-08-08 04:37:37 星期四
css
                    
                        
为什么要使用css sprites?
Comments per page
< Page 1 / 1 >
nowherebutup 2019-08-08 00:45:45
  • 减少HTTP请求
  • 增加图片显示速度
qp97vi 2019-08-08 01:14:24

减少页面向服务器请求次数,优化该页面的加载速度

HCLQ 2019-08-08 02:06:13

就像钱不够,省着用,一块搬开两块用

LinStan 2019-08-08 02:52:32

css sprites指的是将该页面请求的图片资源都拼接到一个图片文件上,通过css从拼接好的图片上获取需要的部分。
优点:
一个是减少了HTTP请求的发送次数
一个是合并后的图片一般小于合并前的图片大小总和
缺点:
如果发生改动需要重新做拼接

xiangshuo1992 2019-08-08 06:44:25

根据项目具体需求来做选择吧,现在小图片用base64 也是可以的,或者图标字体库

Konata9 2019-08-19 09:36:09

CSS sprites 把许多小图片 icon 合成一张大图片。利用 background-position 来显示对应的图片。这样做的好处就是可以减少 http 请求,提高网页的加载速度。如果有 10 个小图标那就需要请求 10 次,如果合成 CSS sprites 就只需要请求一次。

以前一般使用 Photoshop 进行拼接,现在的话有工具可以直接生成。

Comments per page
< Page 1 / 1 >
排行榜
今日答题答题排行
    未答的题
    更多>
      【关注作者公众号】 以面试驱动学习--前端剑解
      【公众号推荐】 不折腾的前端和咸鱼有什么区别

      学习不打烊,充电加油只为遇到更好的自己,365天无节假日,每天早上5点纯手工发布前端知识点(死磕自己,愉悦大家)。希望大家在这浮夸的前端圈里,保持冷静,坚持每天花20分钟来学习与思考。在这千变万化,类库层出不穷的前端,建议大家不要等到找工作时,才狂刷题,提倡每日学习!欢迎大家关注3+1开源项目!希望大家每人去学习与思考!(不要为了谁而来,要为自己而努力!

      【关注官方公众号】 每天4:30-5:00推送
      【公众号推荐】 一起折腾前端算法
      【微信学习群】 备注3+1