图片精灵-css sprite css雪碧图生成工具

http://developer.51cto.com/art/201504/474506.htm

 

移动端：所有的值都是原来雪碧图生成的一半

.icon{background:url(http://192.168.1.113:1000/mobile/images/img.png)  no-repeat;background-size:40px 240px;float:left;}
.icon1{height:40px;width:40px;background-position:0 0;}
.icon2{height:40px;width:40px;background-position:0 -40px;}
.icon3{height:40px;width:40px;background-position:0 -80px;}
.icon4{height:40px;width:40px;background-position:0 -120px;}
.icon5{height:40px;width:40px;background-position:0 -160px;}
.icon6{height:40px;width:40px;background-position:0 -200px;}


PC端正常显示:

.img{background:url(../images/img.png) no-repeat;}
._4{height:80px;width:80px;background-position:0 0;}
._5{height:80px;width:80px;background-position:0 -80px;}
._6{height:80px;width:80px;background-position:0 -160px;}
._1{height:80px;width:80px;background-position:0 -240px;}
._2{height:80px;width:80px;background-position:0 -320px;}
._3{height:80px;width:80px;background-position:0 -400px;}