CSS sprite注意事项

本文介绍了 CSS Sprites 技术如何通过合并多张图片为一张大图来减少 HTTP 请求次数,从而减轻服务器压力。文章还讨论了 CSS Sprites 的适用场景及限制条件,并提到了其可能带来的开发效率降低和维护难度增加的问题。

在网站中,图片的家长会发出HTTP请求,一张图片需要一条HTTP请求,如果一个页面需要加载多张图片,那么会相应的发出多条HTTP请求。HTTP请求书越多,访问服务器的次数就越多,服务器的压力越大。css sprite技术将多张图片合并成一张大图,减少网页HTTP请求数和服务器也来。

但是在使用css sprite中,我们需要注意以下几点:

1、合并的智能是用于背景的图片,对于<img src=""/>设置的图片,无法合并到大图中的。

2、对于横向和纵向都平铺的图片,也不能使用css sprite.

横向平铺时,则需要让该图独占一行

纵向平铺时,则需要让该图独占一列


css sprite有好处,同时也有降低开发效率,维护难的缺点。

由于制作时需要精确量取,会降低开发效果。

更换图像时,会出现维护难。


使用:图片较少更换的情况,且开发时间充足。

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值