您的位置:首页> 日志> 前端技术 正文

    5月底前,接到公司产品专题的页面输出,在输出的时候发现页面都以图片为主,我想到了CSS Sprites。但是一个个去photoshop定位,太麻烦了,我承认我懒惰,主公原谅我吧,我承认我是软件控。indecision

    今天推荐的是CSS森林的小工具:CSS Sprites 样式生成工具,版本出了不少了。发现越来越强大。软件还是基于air平台。

    软件界面简单,通过读取图片,定位好像dreamweaver的热点工具一样,进行区域的框选。好吧,允许我懒惰吧,crying。我读取的是已经定义好的文件:

双击图片,出现一个方形的蓝色块,拖动移动大小和位置,并修改类名。然后点保存修改。然后点保存修改,然后按ctrl+s保存,保存的文件为XML。好强大啊。

移动了这个背景图片的目录,再读取这个XML文件,发现图片没有显示?再选择多一次这个图片。不知道哪里选择?ctrl+o吧。

都做好所有的坐标了,就应用去吧。软件选操作-》生成样式-》样式预览,复制样式。然后粘贴到dreamweaver里面进行YY吧。

软件下载:http://www.cssforest.org/blog/index.php?id=154

CSS Sprites 样式生成工具视频使用教程:http://www.cssforest.org/blog/index.php?id=150