DDR爱好者之家 Design By 杰米
一、关于注释
在创建xhtml+CSS网站时，CSS中的注释非常重要。在创建CSS样式时，应当保持随手注释的习惯。一般的，我习惯于使用“/* 注释内容 */”的格式来写注释，因为在EditPlus等具有高亮功能的编辑器里，使用C语言中常用的“/***************/”之类的注释是无意义的，没有必要填充大量无意义内容作为分隔。带有注释的文档作为网站的原始CSS文档，在发布网站的时候，可以使用CSS压缩工具压缩CSS，在输出的CSS中去掉注释以提高文件传输效率。
二、关于命名
在给CSS文件命名的时候，我比较喜欢使用符合语义的英文名或者缩写命名，在非常用部分也许会用部分拼音命名。另外，在某些有从属关系的class里，我可能会使用类似“list_banner”之类的命名，即父元素名加上“_”再加上元素名。
关于命名，可以根据团队设计师的习惯进行协商。但最好在命名之后加上注释，以便将来生成文档备查。
三、关于继承性
在CSS中，要善用继承性。比如在两个嵌套的div中，父元素定义了background-color属性为黑色，如果子元素的背景同为黑色，则不需重复定义。善于利用CSS的继承性可以让代码更有效、更精简。
四、关于CSS定义的层次
在定义CSS中的class时，建议使用层次分明的方式来描述语句。
示例结构：
<div id="menu">
<div class="menulist">
<div class="selectit"></div>
</div>
</div>
示例CSS：
#menu { ... }
#menu .menulist { ... }
#menu .menulist .selectit { ... }
在上例中，从最终效果来看，#menu没有必要重复出现，但是实际上如果能够在前面加上#menu，将会让文档的层次更加明了，更利于阅读。
五、关于样式排序
在设计CSS样式表时，我们大多是手写代码，这样很容易造成class中的样式排序混乱。比如有几个class中用到了padding、margin、background、color等样式，但是排序的时候，有的class是background比较靠前，有的是margin比较靠前。这样就造成了一定的混乱，容易让思路受挫。我建议个人或者团队的设计师协定一个大致顺序，这样从个别来说看不出太大差别，但从整体上将更加易于阅读和管理，整体效率会提高不少。
比如，我默认将width、height和padding、margin、border等放在较靠前的位置，background其次，然后是控制文本的font、color、text-align等，接着是某些特殊标签才能用到的元素，像list-style等，最后是css滤镜。当遇到特殊情况时（比如CSS某些属性的优先级需要定义）可以灵活处理。
就总结到这里了，火德欢迎大家补充、指正。
在创建xhtml+CSS网站时，CSS中的注释非常重要。在创建CSS样式时，应当保持随手注释的习惯。一般的，我习惯于使用“/* 注释内容 */”的格式来写注释，因为在EditPlus等具有高亮功能的编辑器里，使用C语言中常用的“/***************/”之类的注释是无意义的，没有必要填充大量无意义内容作为分隔。带有注释的文档作为网站的原始CSS文档，在发布网站的时候，可以使用CSS压缩工具压缩CSS，在输出的CSS中去掉注释以提高文件传输效率。
二、关于命名
在给CSS文件命名的时候，我比较喜欢使用符合语义的英文名或者缩写命名，在非常用部分也许会用部分拼音命名。另外，在某些有从属关系的class里，我可能会使用类似“list_banner”之类的命名，即父元素名加上“_”再加上元素名。
关于命名，可以根据团队设计师的习惯进行协商。但最好在命名之后加上注释，以便将来生成文档备查。
三、关于继承性
在CSS中，要善用继承性。比如在两个嵌套的div中，父元素定义了background-color属性为黑色，如果子元素的背景同为黑色，则不需重复定义。善于利用CSS的继承性可以让代码更有效、更精简。
四、关于CSS定义的层次
在定义CSS中的class时，建议使用层次分明的方式来描述语句。
示例结构：
<div id="menu">
<div class="menulist">
<div class="selectit"></div>
</div>
</div>
示例CSS：
#menu { ... }
#menu .menulist { ... }
#menu .menulist .selectit { ... }
在上例中，从最终效果来看，#menu没有必要重复出现，但是实际上如果能够在前面加上#menu，将会让文档的层次更加明了，更利于阅读。
五、关于样式排序
在设计CSS样式表时，我们大多是手写代码，这样很容易造成class中的样式排序混乱。比如有几个class中用到了padding、margin、background、color等样式，但是排序的时候，有的class是background比较靠前，有的是margin比较靠前。这样就造成了一定的混乱，容易让思路受挫。我建议个人或者团队的设计师协定一个大致顺序，这样从个别来说看不出太大差别，但从整体上将更加易于阅读和管理，整体效率会提高不少。
比如，我默认将width、height和padding、margin、border等放在较靠前的位置，background其次，然后是控制文本的font、color、text-align等，接着是某些特殊标签才能用到的元素，像list-style等，最后是css滤镜。当遇到特殊情况时（比如CSS某些属性的优先级需要定义）可以灵活处理。
就总结到这里了，火德欢迎大家补充、指正。
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
暂无评论...
更新日志
2024年12月25日
2024年12月25日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果（九）》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]