细心的朋友们也许早已发现这个选项了,不过一直懒着没写说明,现在补上:)
每改动一点点皮肤要手动更改校友的10+个皮肤文件多有点慢性自杀,更别提Qzone的4、50套皮肤了。有了CssGaga的皮肤1toN,你就可以只维护其中一套皮肤,当然还有一个替换规则文件skin.csv。
1. 皮肤文件的组织方式
根据项目现有的规则,比如有3套皮肤:
skin/py1.css
skin/py2.css
skin/py3.css
比如只维护py1,其余的py2、py3自动生成,则将替换规则文件skin.csv放置在skin文件夹中,即
skin/py1.css
skin/skin.csv
2. skin.csv编写原则
skin.csv可以用office的excel来编辑
备注 | py1 | py2 | py3 |
---|---|---|---|
链接色 | #077D01 | #A86000 | #395690 |
#3D5668 | #7E2225 | #4E4F53 | |
[禽兽](http://qinshou.org/)被yt鄙视的写法 | .frd-add-list .act button.cfm{background-color:#57913c;background-position:0 -160px} | .frd-add-list .act button.cfm{background-color:#ea7b21;background-position:0 -244px} | .frd-add-list .act button.cfm{background-color:#0f7ba3;background-position:0 -202px} |
- 第1列:为备注。可留空,但是必须有这一列
- 第1行:第二列为第一套皮肤文件名,依次类推
- 第2+行:为替换规则。以CssGaga压缩后的代码为准,比如色值#ffffff被压缩为了#fff,则这里要写压缩后的值#fff,再比如
.frd-add-list .act button.cfm { background-color:#57913c ;background-position:0 -160px; }
会被CssGaga压缩成.frd-add-list .act button.cfm{background-color:#57913c;background-position:0 -160px}
所以规则里要写后者
3. 皮肤1toN
以上两步做好后就一劳永逸了,平时维护的就只有这两个文件
skin/py1.css
skin/skin.csv
根据skin1就可以自动生成所有皮肤:
- 勾选皮肤1toN
- 将skin/py1.css拖进CssGaga
- 围观CssGaga文本框的炫丽滚屏
如果同时选择的有自动同步,则自动把生成的皮肤拷贝到几个测试环境去了,爽吧,有了CssGaga,准时下班不再是梦:)
**[CssGaga – 皮肤1toN](http://www.slideshare.net/ytzong/cssgaga-1ton "CssGaga - 皮肤1toN")**
返回[CssGaga – 帮助索引](http://www.99css.com/542)
View more [videos](http://www.slideshare.net/) from [ytzong](http://www.slideshare.net/ytzong)