CSS Sprites : 样式表贴图定位 –SpriteMe 详解

sprite me 是一个bookmark(书签),因此大家只需要把spriteMe添加到自己的书签的工具栏中,访问任意网站需要使用它的时候,只需要轻轻点击一下sprite me就可以哈~

点击以后会在页面的右上方弹出一个覆层。

下面是我对qq首页做的spriteMe 的弹出层;

CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第1张图片

 

下面的图片显示的是spriteMe的一些模块的基本功能介绍~

 
CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第2张图片

当 然在适用它的时候如果我们对它分析的结果中不能做sprite的图片有异议,你可以可以拖拽Non-Sprited Images 的图片直接到上面的Suggested Sprites中,然后点击 make sprite 就可以生成一张css sprites图,至于顶部的new sprite的按钮你可以点击和拖拽list中的任意图片组成一个你想要的
sprite生成。export css可以导出所有图片的定位的css,方便大家应用到自己的css 中。

下面是我用donews.com网站做了个demo的截图

CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第3张图片
CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第4张图片
CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第5张图片

CSS Sprites : 样式表贴图定位 –SpriteMe 详解_第6张图片

 

你可能感兴趣的:(Sprite)