css雪碧图即css sprite问题

[lloyvhe]

css雪碧图在什么时候应该使用，在什么时候不适合用？

[街头小贩]

能用就尽量用。个人拙见非logo都可以用

[街头小贩]

这只是前端优化的一项，目的是减少请求的数量

[LaternKiwis]

css sprit只是为了减少浏览器请求次数，网页优化的

[仅小鱼]

图标级的图片都可以用雪碧图 但是网站背景， banner图 ==用雪碧图就不大合适了

[lloyvhe]

引用 4 楼 u010849322 的回复:

图标级的图片都可以用雪碧图 但是网站背景， banner图 ==用雪碧图就不大合适了

为什么不适合了呢？？

[仅小鱼]

引用 5 楼 lloyvhe 的回复:

[quote=引用 4 楼 u010849322 的回复:] 图标级的图片都可以用雪碧图 但是网站背景， banner图 ==用雪碧图就不大合适了

为什么不适合了呢？？[/quote] 加载啊 大图加载本来就耗时没有时候甚至要为了优化加载速度进行切割分批加载， 怎么可能反而放到一起呢

[lloyvhe]

引用 6 楼 fjfjfj 的回复:

一大堆零零碎碎20x20像素以下的数量庞大的小图标时，要用。 尺寸不一样的，几批图就做成几张雪碧图。 中大型尺寸的图片，或者可复用差的图片，一律不用。反正是非不是特别需要就不用。懒得伺候。因为加进去了再想拆出来就没那么容易了 我喜欢从上到下单列的，或者从左到右单行的雪碧图。所有尺寸基本一致的 喜欢如下写法的。 <style> .sprite{display:inline-block;width:14px;height:14px;background-image:url("../images/sprite.png");background-repeat:no-repeat;} .sp-j5-03{background-position:-0px -0px;} .sp-j5-04{background-position:-14px -0px;} .sp-j5-05{background-position:-28px -0px;} </style> <i class="sprite sp-j5-03"></i> <i class="sprite sp-j5-04"></i> <i class="sprite sp-j5-05"></i> 曾经见到一人的程序，background-position: 这里写了各种 top right center bottom之类，图片尺寸还不一致。我想往雪碧图里面新加小图的时候，有种想掐死他的冲动。

ok，明白啦！！

[fjfjfj]

一大堆零零碎碎20x20像素以下的数量庞大的小图标时，要用。 尺寸不一样的，几批图就做成几张雪碧图。 中大型尺寸的图片，或者可复用差的图片，一律不用。反正是非不是特别需要就不用。懒得伺候。因为加进去了再想拆出来就没那么容易了 我喜欢从上到下单列的，或者从左到右单行的雪碧图。所有尺寸基本一致的 喜欢如下写法的。 <style> .sprite{display:inline-block;width:14px;height:14px;background-image:url("../images/sprite.png");background-repeat:no-repeat;} .sp-j5-03{background-position:-0px -0px;} .sp-j5-04{background-position:-14px -0px;} .sp-j5-05{background-position:-28px -0px;} </style> <i class="sprite sp-j5-03"></i> <i class="sprite sp-j5-04"></i> <i class="sprite sp-j5-05"></i> 曾经见到一人的程序，background-position: 这里写了各种 top right center bottom之类，图片尺寸还不一致。我想往雪碧图里面新加小图的时候，有种想掐死他的冲动。