最新CssSpriteDIY2.0
http://v.qq.com/boke/page/p/j/w/p01086lj9jw.html CssSpriteDIY视频地址
http://download.csdn.net/detail/xiefengfan/4860106 CssSpriteDIY下载地址
http://www.bfwjw.com/news/4df8727d-556a-417a-a3db-a28400c5d791.html 免费下载地址
CssSprite在国内很多人叫CSS精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言,不高于200KB的单张图片的所需载入时间基本是差不多的,所以无需顾忌这个问题。
加速的关键,不是降低重量,而是减少个数。传统切图讲究精细,图片规格越小越好,重量越小越好,其实规格大小无所谓,计算机统一都按BYTE计算。客户端每显示一张图片都会向服务器发送请求。所以,图片越多请求次数越多,造成延迟的可能性也就越大。
先前已经发布了一个版本,通过大家的反馈,本人连夜整理了一个新的版本 基于WPF开发的一个2.0版本。此版本需要支持Framework3.5以上平台。
下面就给介绍下简单应用
通过拖拽布局
起好样式名字保存
生成的文件
生成的图片
生成的 HTML 文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CssSpriteDIV v2.0_XFF提供有建议或者异常请截图邮件告知,my_jsj@163.com,谢谢支持</title>
<style type="text/css">
.DIY_cssTest span {background:url('cssTest.png') no-repeat;display:block;float:left; }
.class_0{background-position: 0px -13px !important;width:128px;height:128px;}
.class_1{background-position: -6px -156px !important;width:158px;height:42px;}
.class_2{background-position: -134px -12px !important;width:158px;height:42px;}
.class_3{background-position: -133px -93px !important;width:158px;height:42px;}
.class_4{background-position: -175px -151px !important;width:128px;height:128px;}
.class_5{background-position: -8px -220px !important;width:158px;height:42px;}
</style>
</head>
<body>
<div class="DIY_cssTest">
<span class="class_0"></span>
<span class="class_1"></span>
<span class="class_2"></span>
<span class="class_3"></span>
<span class="class_4"></span>
<span class="class_5"></span>
</div>
</body>
</html>
http://v.qq.com/boke/page/p/j/w/p01086lj9jw.html CssSpriteDIY视频地址
http://download.csdn.net/detail/xiefengfan/4860106 CssSpriteDIY下载地址
有问题 my_jsj@163.com 吐糟 谢谢
希望大家支持原创