如果一个网页中有很多小图片，例如评论时的表情，投票时的“星级”，这些小图片确实很小，但是每张小图片显示一次都要往返一次HTTP服务器，每次往返都需要发送请求、接受请求。如果图片小而且多，会严重影响页面呈现的速度。如果我们把这些小的图片合成一个大的图片，那么浏览器只要发送一次请求，就可以把所有这些“小图片”下载到本地。然后使用CSS显示这些小图片。
利用CSS的background-position 属性轻松设置；
定义
background-position 属性设置背景图像的起始位置。
继承性：No
说明
这个属性设置背景原图像（由 background-image 定义）的位置，背景图像如果要重复，将从这一点开始。
示例：
<div style="16px;height:16px;background-image: url(http://img.baidu.com/img/iknow/icons.gif);background-position:0 -32px;"></div>
;background-position:0){kind=link}
<div style="16px;height:16px;background-image: url(http://img.baidu.com/img/iknow/icons.gif);background-position:0 -112px;"></div>
因为每个小图片的长宽分别是16px，所以显示第一个图片坐标就是0 0，第二个图片的坐标是：0 -16px，第三个图片的坐标是0 -32px，以此类推……
从JS角度优化页面加载速度，主要是从JS会缓存到浏览器，所以我们把页面公共部分做成JS文件调用。然后每个页面再调用这个JS，这里还有另一个主要因素：如果您的带宽有限，比如流量达到了15万，而你使用的是100M共享带宽。这时带宽已经跑满了，你需要想办法给网页减肥，让页面更小，这样就可以减少带宽占用，缓解带宽的危机。
参考：http://www.svnhost.cn/Article/Detail-234.shtml