css精灵,又叫css背景精灵
“css精灵”,英语css sprite,所以也叫做“css雪碧”技术。是一种CSS图像合并技术,该方法是将小图标和背景图像合并到一张图片上,然后利用css的背景定位来显示需要显示的图片部分。
css精灵有什么优点,就是减少了http请求。比如4张小图片,原本需要4个http请求。但是用了css精灵,小图片变为了一张图,http请求只有1个了。
用fireworks精确控制精灵:
例如:我们要显示“爱逛街”这个小图。
(1) 先在原图(淘宝网的精灵图),用切片,框选出 你要显示图的 大小(你用切片框选出矩形的宽度和高度,等价于你再页面中给盒子设置width和height)。
(2) 我们使用fireworks中的切片绘制矩形。用矩形的宽度和高度,表示 当前小图 向左移动量 和向上移动量。
代码如下:
<title>css精灵,又叫css背景精灵。</title> <style> *{ margin: 0; padding: 0; } .box1{