《
什么是css sprites》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/030233I22013.htm
Tag：Sprites ,
什么是CPM、CPC、CPA、CPS广告; CSS Sprites CSS
下面通过一个很简略的实例让你更好得懂得什么是css sprites，以及我们要怎么应用它：
小贴士：在页面小图良多，须要做成多个sprites图片时，可以按色彩分类，尽量将雷同、相近颜色的小图整合在一张大图上，这样能够有效减小合成后图片的体积。
通过以下代码就实现了我们想要的后果：
--> [
网站建设之]什么是css sprites
/* html */
<a class="left",交互，使用，交互设计和可用性; href=" target="_blank",交互设计指南 一次点击;>CSS网页布局的常用标准</a>
<a class="right",交互设计分析 通过设计减少用户的出错; ,五维指标体系 全面诊断电子商务网站运营状况;href=",五种常见的网页布局; target="_blank">适用CSS重置基本代码</a>
利用CSS Sprites能减少网页的http请求，从而大大减轻了服务器的累赘，这是CSS Sprites最大的长处，也是其被普遍传布和运用的重要起因。因为3张图片合并成1张图片的字节老是小于这3张图片的字节总跟，CSS Sprites也减少了图片的字节，对带宽的请求也相应的减少。而只对一张图片修改、命名也比对每个小元素图片进行修正、命名便利许多，从而进步了制作和保护效力。
CSS Sprites实在就是把网页中一些背景图片整合到一张图片文件中，再应用CSS的“background-image”、“background-position”的组合进行背景定位，用数字准确地定位出背景图片的地位。（假如还不完整控制CSS背景定位，请参阅《CSS背景：详解background属性 》。）
以最常见的为上、下页链接增加按钮款式为例,五种令人印象深刻的网页头部设计。通常咱们会把按钮图片保留成两个独自的文件，再通过左、右两个链接的background属性调用它们。而css sprites就是把这两张小图整合到一张大图上，通过background-position属性来把持左、右两个链接的背景显示,五步塑造你网站的可信度。
,五个方面促进你写出更加专业的CSS代码;
在调剂一个小图片的位置时，要考虑到它的左、右多少像素规模内不能出现别的图片，还有它所在的行，上、下多少像素范畴是保险间隔？做图时要多丈量、多测试、不怕繁琐，这样能力做出体积玲珑、布局公道的优质图片。精工出细活！
什么是 CSS Sprites，它是一种网页图片利用处置方法：将一个页面波及到的零碎图片都包括到一张大图中去。这样一来，当拜访该页面时，客户端只要要向服务器要求少量的图片，图片越多恳求次数越少，造成延迟的可能性也就越小，能有效减轻服务器的压力。
/* css */
a {background:url(sprites.gif) no-repeat;}
a.left {float:left; padding-left:20px; background-position:0 3px;}
a.right {float:right; padding-right:20px,互联网的用户类型与广告模式; background-position:right -23px;}
信任你当初对css sprites以及它的原理、用法都有了初步的意识吧。制造css sprites图片是个粗活，尤其是有十分多的小图需要整合的页面，工作量会比拟大。我们在做之前就要细心斟酌它们的布局问题，这样才干少走弯路。比方上面的例子中两个蓝色的按钮需要在网页中的同一排显示，在做图片的时候我们就不能把它们放在统一程度线上，免得它呈现在不该涌现的位置捣乱页面。
(责任编辑：网站建设)
什么是css sprites相关文章