SpriteMe 页面CSS图片工具
SpriteMe是Google的一个开源项目,可以用来方便地找出一个页面中所使用的图片,然后可以将所以图片合并到一个“Sprite”图片,然后再通过
CSS控制调用哪一个区域,其提供了一个网站来安装,演示使用方法,http://spriteme.org/ 。
安装方法很简单,按照上面那个页面上的提示,将一个链接拖到“书签工具栏”即可,然后再按照上面的“Demo”一步步的操作。
SpriteMe 提供的特性:
查找页面背景图片;
组织所有图片到一个 sprites;
生成 sprite;
将生成的 sprite 注到当前页面;
重新计算背景图片位置的CSS。
该工具很方便使用,对于网页开发者可以提高其页面设计的效率,很赞!!
相关文档:
1.超链接访问过后hover样式就不出现的问题?
被点击访问过的超链接样式不在具有hover和active了,解决方法是改变CSS属性的排列顺序: L-V-H-A
2.IE6的双倍边距BUG
例如:
<style type="text/css">
body {margin:0}
div { float:left; margin-left:10px; width:200px; ......
.box128{
width:128px;
height:128px;
text-align: center;
vertical-align:middle;
display:table-cell !important;
display:block;
border:1px solid #DDD;
  ......
1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因,这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域,需要 200*200=40, 000 次,占用资源。
2、无边框。推荐的写法是 border:none;,哈哈,我一直 ......
css圆角box备忘 <style type="text/css">
div.box{}
div.boxtitle{background-color:#888; height:24px; line-height:24px; vertical-align:middle; padding-left:10px;}
div.boxcontent{ padding:10px; border:1px #888 solid;}
b.r {display:block;background: #fff} ......