css sprites是干啥的？ 简单来讲就是把多个icon（小图标），通过ps等工具合并为一张图片，从而达到减少http请求的次数，以提高网页加载速度（性能）的一种方式。 主要的优点就是提高加载速度，还有个小优点就是，减少图片命名，相信命名这件事是大家都有的困扰。 但是缺点也是有的，比如制作的时候 ...
分类：
Web程序 时间：
2020-04-14 20:24:29
阅读次数：
94
CSSSprite 减少对服务器请求SVGSprite 体积小，矢量Iconfont 体积小，矢量，集成度高Base64 减少对服务器请求 CSSSprite 减少对服务器请求 CSS Sprites 技术就是将这些小icon合并成一张图片,只需要加载一次,每次通过background-positi ...
分类：
Web程序 时间：
2020-03-06 10:32:23
阅读次数：
120
雪碧图（Sprites） 雪碧图也叫CSS精灵， 是一种CSS图像合成技术，就是将许多小图标合并在一张背景透明的图片上，使用background-position和background-size来控制图片显示的区域。 为什么要使用雪碧图 网站开发90%会用到小图标， 多小图标调用显示是前端开发常见的 ...
分类：
其他好文 时间：
2019-12-23 00:33:44
阅读次数：
320
今天做测试，遇到一道选择题。 瞬间一脸懵逼，sprites是什么？通过对各选项的分析，大致明白了几点：1、它是css属性。2、它与图片有关。3、它是背景图片。然后就选了一个大概不靠谱的，成功的选错了。 通过查找资料得知，CSS Sprites 也叫雪碧（Sprite）图，将网页中的多个小图标，集合到 ...
分类：
其他好文 时间：
2019-12-03 14:08:02
阅读次数：
92
性能优化基本是BAT等一线互联网公司程序员必备的技能，以下为大家完整揭晓性能完整的优化方案和方法：包含web网站调优、数据库、JVM调优、架构调优等方案。
第一：Web网站调优
1、尽可能减少HTTP请求：图片合并 （css sprites），Js脚本文件合并、css文件合并。
2、减少DNS查询
3、将css放在页面最上面，将js放在页面最下面
4、压缩js和css
减少文件体积，去除不必要的空白符、格式符、注释（即对代码进行格式化）
5、把js和css提取出来放在外部文件中
这一条要灵活运用，把js和css提取出来放在外部文件的优点是：减少html体积，提高了js和css的复用性，提高日后的可维护性
缺点：增加了http请求，不过这一点可以通过缓存来解决。
什么情况下将js和css写在页面内呢，可以分为几种情况：js和css代码比较少；这个页面不怎么会访问
6、避免重定向
重定向就是用户请求的页面被转移到了别的地方，浏览器向服务请请求一个页面，服务器告诉浏览器请求的页面已经被转移到另外一个页面，并告知另一个页面地址，浏览器就再发送请求到重定向的地址。这样会增
分类：
数据库 时间：
2019-11-21 09:42:17
阅读次数：
103
精灵技术 减少服务器的请求次数 把一些小的图片整合到一张大的图 Fireworks与photoshop cs6使用差不多 使用方法： 1.主要针对小的背景图片使用，就是把多个小背景图片整合到一张大图片上 2.这个大图片也称之为sprites图或者雪碧图 3.移动背景图片位置可以使用backgroun ...
分类：
Web程序 时间：
2019-11-20 19:13:35
阅读次数：
104
精灵图 1. 为什么需要精灵图 为了有效的减少服务器接收和发送请求的次数，提高页面的加载速度。出现了CSS精灵技术 2. 精灵图（sprites）的使用 精灵技术主要针对背景图片。就是把多个小背景图片整合到一张大图片中。 这个大图片也称为sprites精灵图或者雪碧图 移动背景图片位置，使用back ...
分类：
Web程序 时间：
2019-11-16 00:01:48
阅读次数：
161
CSS Sprites一般只能使用到固定大小的盒子（box）里，这样才能够遮挡住不应该看到的部分。 1.优点1、利用CSS Sprites能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；2、CSS Sprites能减 ...
分类：
其他好文 时间：
2019-10-25 15:03:42
阅读次数：
86
一、css sprites（雪碧图或精灵图） 网页图片处理的一种方式，它允许你将一个页面涉及到的所有零星图片都包含到一张大图中，当访问页面时，载入的图片就不会像以前那样一副一副的慢慢的显示出来了。 原理：使用background-image属性，background-position属性定位某个图片 ...
分类：
Web程序 时间：
2019-10-24 23:17:17
阅读次数：
122
一、前端性能优化问题解决 1.减少http请求 (1)从设计实现层面简化页面 (2)合理设置http缓存 (3)资源合并与压缩 (4)css sprites：合并css图片、减少请求数 2.将外部脚本置底（将脚本内容在页面信息内容加载后在加载） 浏览器是可以并发请求的，这一特点使得其能够更快的加载资 ...
分类：
其他好文 时间：
2019-08-19 21:15:12
阅读次数：
64
