【08】css sprite是什么?有什么优缺点?


概念:将多个小图片拼接到一个图片中。通过background-position和元素尺寸调节需要显示的背景图案。

优点:

  1. 减少HTTP请求数,极大地提高页面加载速度。
  2. 增加图片信息重复度,提高压缩比,减少图片大小。
  3. 更换风格方便,只需在一张或几张图片上修改颜色或样式即可实现。

缺点:

  1. 图片合并麻烦。
  2. 维护麻烦,修改一个图片可能需要从新布局整个图片,样式。


**

【08】css sprite是什么,有什么优缺点的更多相关文章

  1. 01. css sprite是什么,有什么优缺点?

    1.css sprite是什么,有什么优缺点? 通常被意译为“CSS图像拼合”或“CSS贴图定位” 1)CSS Sprites的优点 利用CSS Sprites能很好地减少网页的http请求,从而大大 ...

  2. CSS Sprite的优缺点分析

    目前大多数的开发人员对这个技术都有相当地掌握,也有很多关于它的教程和文章.几乎所有的文章中都宣称设计师和开发人员都应该使用 CSS sprite 来减少 HTTP 请求数,并且节省一些流量.这个技术被 ...

  3. CSS Sprite雪碧图的应用

    CSS雪碧图,即CSS Sprite,也有人叫它CSS精灵图,是一种图像拼合技术.该方法是将多个小图标和背景图像合并到一张图片上,然后利用CSS的背景定位来显示需要显示的图片部分. 雪碧图的使用场景 ...

  4. css sprite,css雪碧图生成工具V3.0更新

    V3.0主要改进 1.增加了单独添加单张图片以及删除单张图片的功能 2.增加了生成.sprite文件用以保存雪碧图信息 3.增加了打开.sprite文件功能 什么是css sprite CSS spr ...

  5. css sprite 调整大张图片中小图标的大小

    直接说解决方法: 假设一张拼合好的大图大小是:900 x 1000 px (如上图) 现在想取图中左上角的河马图标,并缩小图标的大小. 正常取图: .sprite { background: url( ...

  6. HTML CSS SPRITE 工具

    推荐一个CSS SPRITE工具 网盘分享:http://pan.baidu.com/s/1sjx7cZV

  7. CSS Sprite雪碧图应用

    在写网页过程中,会遇到这种需要使用多个小图标: 如上图中的「女装」文字左边的图标.容易想到的解决方法是为每张图片加入<img>标签,但这样做会增加HTTP请求数量,影响网站加载速度.比这更 ...

  8. CSS雪碧,即CSS Sprite 简单的例子

    CSS Sprite生成工具 http://pan.baidu.com/s/1gdGQwiJ 工具可将多幅图片整合一张,并生成CSS. HTML代码 <style> .img{backgr ...

  9. 使用compass自动合并css雪碧图(css sprite)

    本文转载自: 使用compass自动合并css雪碧图(css sprite)

随机推荐

  1. c指针参数常见错误

    参数的地址是可以修改的,修改后的地址是不可能传回给调用处的指针变量.也就是说,可以修改参数地址所指的单元的值,这是可以传回到调用处的变量里面的. #include <stdio.h> #i ...

  2. HDU 5869 Different GCD Subarray Query 树状数组 + 一些数学背景

    http://acm.hdu.edu.cn/showproblem.php?pid=5869 题意:给定一个数组,然后给出若干个询问,询问[L, R]中,有多少个子数组的gcd是不同的. 就是[L, ...

  3. 牛客网Java刷题知识点之Java为什么不能支持多继承,但可以用接口来间接实现多继承

    不多说,直接上干货! java只支持单继承,这是由于安全性的考虑,如果子类继承的多个父类里面有相同的方法或者属性,子类将不知道具体要继承哪个,而接口可以多实现,是因为接口只定义方法,而没有具体的逻辑实 ...

  4. C++面试中的singleton类

    引子 “请写一个Singleton.”面试官微笑着和我说. “这可真简单.”我心里想着,并在白板上写下了下面的Singleton实现: 1 class Singleton 2 { 3 public: ...

  5. wine使用

    wineqq 不能输入问题winecfg在 wine 设置里,选择函数库添加 riched20, 就行了(原装领先于内建) wineqq 可以输入不能输入中文问题原因:fictx组件缺失 搜狗输入法没 ...

  6. 解决java.lang.NoClassDefFoundError: javax/xml/rpc/service错误的方法

    最近在做WebService项目,本地测试没有问题,打算部署到服务器上,但是部署后,访问时出现了如下图1的错误: 图1 图1报的是没有找到定义的类的错误.刷新页面有又出现了另外“新”的错误: 图2 根 ...

  7. 7.html超链接的使用

    <html> <head> <title>第七课网页标签</title> <meta charset="utf-8"> ...

  8. MySQL出现GROUP BY clause错误解决办法

    #1)当mysql数据库出现如下错误:#which is not functionally dependent on columns in GROUP BY clause; this is incom ...

  9. 融云参加RTC实时互联网大会 现场集成IM SDK

    9月21至22日,由全球实时云服务商声网Agora.io主办的RTC2017实时互联网大会在北京万豪酒店成功举办.作为亚洲最权威的RTC实时通信行业技术盛会,会议吸引了来自全球上千名开发者参加,Goo ...

  10. 【Python】使用cmd模块构造一个带有后台线程的交互命令行界面

    最近写一些测试工具,实在懒得搞GUI,然后意识到python有一个自带模块叫cmd,用了用发现简直是救星. 1. 基本用法 cmd模块很容易学到,基本的用法比较简单,继承模块下的Cmd类,添加需要的功 ...