web前端sprite,精灵图,雪碧图

css sprite

俗称:精灵图,雪碧图,指将整个页面不同的图片or图标合并在一张图上;
优点:使用CSS Sprite 可以减少网络请求,提高网页加载性能,不会出现网页上端加载完毕下面还在加载中这一问题

缺点:如果后期更改其中某一图标,且其像素大小发生改变,需要重新对所有图标进行定位

精灵图制作:

photoshop选择透明图层,将需要的图标和图片放入

 

测试用图:

web前端sprite,精灵图,雪碧图_第1张图片



	
		
		
		
	
	
		

	

 

你可能感兴趣的:(html,前端优化)