天气转凉了，又开始贪恋暖暖的被窝了。
早上不想起床的时候在被窝里看了有关于雪碧图的视频。
1.使用场景
V导航条，登录框img标签多次载入，性能低
X大图banner按需加载，如果做成雪碧图一次加载就会载入比较久
X纯色背景的按钮
X动态图片
总结：1.静态图片，不随用户信息变化而改变
2.小图片，3-5k
3.加载量比较大
优点：有效减少http的请求数量，加速内容显示
缺点：1.内存缺陷；2.页面缩放有暴露风险；3.对爬虫不友好
2.实现原理
同一张背景图，改变background-position，调整x轴和y轴从而改变背景图可视的区域
如图，需要显示裙子时background-position:0 0; 显示高跟鞋时background-position:0 -24px; 显示窗帘时background-position:-41px 0;
注意：单位，坐标为负值。
3.实现方式
ps手动拼图，量少小网站
雪碧图生成工具，有在线生成
一边看视频一边敲代码练习，总是可以把标注30min的视频延长至2hour
可能是坐姿有问题，常常肩膀疼背疼，太久ps的时候也会这样
恩，虽然不饿，但是是时候下楼吃个饭了，下午继续