快速业务通道

CssGaga教程:皮肤1toN

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-02-23

细心的朋友们也许早已发现这个选项了,不过一直懒着没写说明,现在补上:)

每改动一点点皮肤要手动更改校友的10+个皮肤文件多有点慢性自杀,更别提Qzone的4、50套皮肤了。有了CssGaga的皮肤1toN,你就可以只维护其中一套皮肤,当然还有一个替换规则文件skin.csv。

1. 皮肤文件的组织方式

根据项目现有的规则,比如有3套皮肤:

skin1/py.source.css
skin2/py.source.css
skin3/py.source.css

比如只维护skin1,其余的skin2、skin3自动生成,则将替换规则文件skin.csv放置在skin1文件夹中,即

skin1/py.source.css
skin1/skin.csv
skin2/py.source.css
skin3/py.source.css

2. skin.csv编写原则

skin.csv可以用office的excel来编辑

备注 skin1 skin2 skin3
链接色 #077D01 #A86000 #395690
  #3D5668 #7E2225 #4E4F53
禽兽被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. 第1行:第二列必须为skin.csv所在的文件夹名,之后分别为其余皮肤所在的文件夹名
  3. 第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

以上两步做好后就一劳永逸了,平时维护的就只有这两个文件

skin1/py.source.css
skin1/skin.csv

根据skin1就可以自动生成所有皮肤:

  1. 勾选皮肤1toN
  2. 将skin1/py.source.css拖进CssGaga
  3. 围观CssGaga文本框的炫丽滚屏

如果同时选择的有自动同步,则自动把生成的皮肤拷贝到几个测试环

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号