扫描图片目录生成图标css。
图标图片目录示例：
icons
├─ add.png
├─ del.png
├─ A
├─ Add.png
├─ ServiceSupport.jpg
├─ window_icon_max.pngjava -jar IconCssGenerator.jar images/icons icons_test.css生成 icons_test.css：
.icon-add {
background: url(icons/add.png) no-repeat center center;
}
.icon-del {
background: url(icons/del.png) no-repeat center center;
}
.icon-a-add {
background: url(icons/A/Add.png) no-repeat center center;
}
.icon-a-servicesupport {
background: url(icons/A/ServiceSupport.jpg) no-repeat center center;
}
.icon-a-window-icon-max {
background: url(icons/A/window_icon_max.png) no-repeat center center;
}示例：
ImageFileToIconCssGenerator generator = new ImageFileToIconCssGenerator();
generator.setCssRuleGenerator( new DefaultCssRuleGenerator() ); //使用 DefaultCssRuleGenerator
generator.setInputDir( new File("images/icons") );
generator.setOutputStream( new FileOutputStream(new File("icons_test.css")) );
generator.generate();ImageFileToIconCssGenerator有一个方法setCssRuleGenerator，其参数类型为AbstractCssRuleGenerator，抽象了如何生成css选择器和css声明块。内置了一个子类DefaultCssRuleGenerator实现:
css选择器
- 目录名作为名字部分
- 多个单词用横线连接
- 小写
css声明块
使用以下模板:
{
background: url(根路径/图片路径) no-repeat center center;
}setRelativeBasePath方法可以设置background url的根路径。
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent