在前端开发中我们常常遇到图片过大,这里我推荐几款比较好用的压缩图片大小的网站给大家,还有遇到比较小的图片我们可以将它做成雪碧图。
www.onlineimagetool.com/zh/compress…
tinypng.com/
以上这两是压缩图片,也可以将图片转成别的格式,非常好用!
上面这是做雪碧图的工具,只需要把要做成雪碧图的图片放进去,它会自动生成位置图标,很好用!具体的用法如下
background: url('../assets/css_sprites.png') no-repeat -9.34rem -3.49rem; // 后面的值是图所在雪碧图的位置
background-size: 11.58rem 8.29rem; // 雪碧图的大小
图片优化到这一部了,如果想进一步优化,可以把一张图片的公共部分切出来,用css3进行平铺,这种方法就是前端的工作量是大了点,但是做的好的话对整个项目性能也是有改善的。