CssGaga - Image to Code

CssGaga – AutoSprite 对 slice 的 class 写法有些硬性要求,类似如下格式:

.icon{width:16px;height:16px;background-image:url(img/slice/icon.png);}

每次都去看图片属性查大小写url也是浪费生命,于是增加了 image to code 功能,使用方法:

  1. 拖拽 img 目录(或子目录)中的图片到 CssGaga,支持批量操作
  2. 复制 CssGaga 输出的 Image code 到你的 css 代码中

默认的 Image code 格式如下:

.btn-share{width:90px;height:32px;background-image:url(img/slice/btn-share.png);}

如需自定义格式则可在配置文件中设置

<add key="sliceCode" value=".%filename%{$}" />  

其中 %filename% 对应上面代码中的 btn-share$ 对应 width:90px;height:32px;background-image:url(img/slice/btn-share.png);

例如想要生成的格式为

{width:90px;height:32px;background-image:url(img/slice/btn-share.png);}
{width:106px;height:32px;background-image:url(img/slice/btn-login-share.png);}

<add key="sliceCode" value="{$}" />  

返回 CssGaga – 帮助索引