CSS切割图片，使用一张包含很多ico等图片的素材使用在不同的元素里。CSS切割真正意义上的并不是切割，而是利用CSS的属性取图片其中的一部分显示出来。这样的好处就是大大减少了网页打开的时间，提高了网站体验度。

CSS实现一张大图切割的方式有两种，一种是作为某一个元素的背景图片，另外一种是利用img的属性。

1、img元素属性clip的rect。用法说明：

img{ 
    position:absolute; 
    clip:rect(20px 100px 50px 20px); 
}

clip的4个参数，分别是对应图片img的左上角为坐标起点，第1个参数y1是定位的y坐标(垂直方向)的起点，第二个参数x1定位的x坐标(水平方向)的起点 ，第三个y2定位的y坐标(垂直方向)的终点 ，第四个x2定位的x坐标(水平方向)的终点 。

2、用CSS中background属性。事例代码：

background:transparent url(123.jpg) no-repeat scroll -140px -20px;

transparent表示透明无颜色 

-140px 表示水平位置在图片的-140px处（以图片的左上角为0,0） 

-20px 表示垂直位置在图片的-20px处（以图片的左上角为0,0）