动易SW系统CSS风格样式3D模型盒和定义规范

四、CSS定义的分类与注释

　　为了方便其他设计者或用户理解定义的CSS的作用、用途与范围，默认的CSS提供了简要的注释。设计师在新定义了特殊用途的CSS样式后，也应及时添加相应的注释，以方便他人理解与再次运用。

1、注释的标准
　　CSS样式的注释以“/* ××× */”标注，前后加“/*”和“*/”开始和结束注释，在“*”和内容相结处空半个空格（注意：“*”和“/”不能加空格）。
　　注释按频道使用CSS分类、注释，如：“/* --留言频道css定义开始-- */”、“/* --留言频道css定义结束-- */”。

2、 注释的位置
　　将各模板都有机会使用的CSS定义进行注释。如：

注释放在最前：
/* 文本框的CSS定义:对应CSS中的“INPUT”，这里为文本框的风格设置，可定义内容为背景、字体、颜色、边框等 */
Input
{
background-color: #ffffff;
border: #666666 1px solid;
color: #666666;
HEIGHT: 18px;
border-color: #666666 #666666 #666666 #666666; font-size: 9pt
}

注释放在定义名后面：
.top_tdbgall /* 顶部表格总背景颜色定义 */
{
width: 760;background:#ffffff;
}

3、按位置使用CSS分类标注
　　在“* ×××*/”注释中，内置三种标识：

以下是引用片段：
/* ==频道通用表格CSS定义开始== */
　　内置“==”表示某一大类CSS的定义范围及注释。

/* --评论显示页的CSS定义开始-- */
　　内置“--”表示属于本大类中某一小类CSS的定义范围及注释。

/* 灰色表格边框背景颜色定义(760) */
　　内置无符号表示单独CSS的定义范围及注释。

如：

以注释进行分类：
/* ==频道通用表格CSS定义开始== */
.Channel_border /* 灰色表格边框背景颜色定义(760) */
{
border: 1px solid #cccccc;
}
.Channel_title /* 标题背景颜色定义(760) */
{
background: #cccccc;color: #037FA8;height: 27;text-align: center;font-weight:bold;
}
.Channel_tdbg /* 表格背景颜色定义(760) */
{
background:#FAFAFA;line-height: 120%;
}
.Channel_pager /* 分页表格背景颜色定义(760) */
{
background:#FAFAFA;line-height: 120%;
}
　　/* --评论显示页的CSS定义开始-- */
.Comment_border /* 蓝色表格边框背景颜色定义(760) */
{
border: 1px solid #449AE8;
}
.Comment_title /* 标题背景颜色定义(760) */
{
background:#449AE8;color: #ffffff;font-weight: normal;height: 25;
}
.Comment_tdbg1 /* 表格背景颜色定义(760) */
{
background:#FFFFFF;line-height: 120%;
}
.Comment_tdbg2 /* 留言显示1px表格背景颜色定义 */
{
background:#FAFAFA;
}
　　/* --评论显示页的CSS定义结束-- */
/* ==频道通用表格CSS定义结束== */

　　良好的注释习惯能让更多人读懂你写的内容，同时也容易查找一规范。

附：CSS学习资源

参考书籍：
css2中文手册.chm
css滤镜_filter_ref.chm
css默认行为behavior_ref.chm
css样式表_ref.chm
CSS权威指南.pdf

Home << 1 2 3 4 5 6 >> End

作者：雅虎发布时间：2008年09月20日点击数：【收藏】【打印文章】

上一篇：没有了！　　下一篇：《动易网站管理系统》模板制作示例

动易雅虎

推荐阅读

动易SW系统CSS风格样式3D模型盒和定义规范

作者：雅虎发布时间：2008年09月20日点击数：【收藏】【打印文章】

查看本文的所有评论 >>网友评论