关于css3sprites的信息

web长页面如何优化?

1、减少接口调用次数，如：以商品详情页为例，商品的一些特性，可以在一个接口返回，尽可能的减少接口调用的个数，因为每次接口的处理都有网络IO，对象序列化，压缩和解压的过程。

2、减少IO读取操作。避免使用CSSExpression（css表达式)又称Dynamicproperties(动态属性)。图片预加载，将样式表放在顶部，将脚本放在底部加上时间戳。

3、网站的权重控制，我们要用用robots.txt屏蔽js、css文件等无意义、不需要权重的页面。减少权重的分散。

4、页面级优化 减少 HTTP请求数这条策略基本上所有前端人都知道，而且也是最重要最有效的。都说要减少 HTTP请求，那请求多了到底会怎么样呢 ？首先，每个请求都是有成本的，既包含时间成本也包含资源成本。

相关问答

Q1: 精灵图的核心原理是什么?

1、CSS Sprites会将多个图像组合成一个称为精灵表或拼贴图的单个图像，用户不下载多个文件，而是下载单个文件并通过偏移文件显示必要的图像（或精灵图）。

2、什么是精灵图：css精灵(CSS sprites)，是一种网页图片应用处理技术。

3、最后，根据创意进行细节修饰和色彩调整，使人物精灵图更加生动和吸引人。

4、图形模型是一种用于表达三维物体的数学模型，通过定义一组几何、材质和纹理等属性，来描述物体在三维空间中的形态和质感。

5、基于Lua 脚本语言。触动精灵的脚本编写基于Lua 脚本语言，支持其所有标准函数库。

Q2: 前端性能优化-雪碧图及其实现

1、CSS Sprites 因其英文被称为 雪碧图 。 主要用于把一堆小图标整合在一张背景透明的大图上，通过设置对应的位置来显示不同的图片，目的是大幅减轻服务器对图片的请求数量，是前端性能优化的一种方式。

2、一般来说，在某一模块（比如一个播放器）需要的图片很多而每张图片又不是很大时，可以考虑切成雪碧图交给前端。但目前很多前端构建工具里面有雪碧图合并功能，所以如果前端使用了构建工具可以把合并的功能交给前端。

3、雪碧图被运用在众多使用了很多小图标的网站上。相对于把每张小图标以.png格式文件的形式引用到页面上，使用雪碧图只需要引用一张图片，对内存和带宽更好。

4、请求合并是前端优化的必要手段，不止是针对图片，这里我只列举针对图片优化的方案，当然每种方案都有他的弊端。

5、减少http请求：在YUI35规则中也有提到，主要是优化js、css和图片资源三个方面，因为html是没有办法避免的。

关于css3sprites和的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。