冰果

新模板系统为我们预设了很多的CSS对象（id、class），无疑为我们DIY模板提供了相当大的自由度。
今儿个，我选取其中较为常用的一些CSS对象，来稍加说明。（仅限菜鸟看，高手就别来笑话我了。嘿嘿。）

鉴于水平所限，可能会有不准确的地方。如果你有异议，请提出来交流探讨。如果有我没提到的，你也可以提出，我添加上去。
此文章你可以任意转载。是否注明出处随便你。我已同步将其发在歪酷新模版提问交流小组。
请歪宝宝们一起：爱歪酷，感谢歪酷，祝福歪酷！

世玉提醒：

CSS语法很严谨，空格、英文句点、“#”、英文逗号，加与不加的区别很大。请看清楚。
优先级问题：浏览器执行CSS语句的时候遵循“就近原则”，即：标签会使用离它最近的样式设置。在两条语句都符合调用条件的情况下，距离目标元素标签最近的那条（通常是处于下方的那一条）优先被调用执行。高优先权样式将继承低优先权样式的未重叠定义，但会覆盖重叠的定义。因此请注意CSS语句的顺序。本文接下来就将按基于优先级的书写顺序，来进行介绍。
凡是我说“区域”样式或“整体”样式的那些CSS对象，都是盒模型，可以定义边框、背景等。其它的则视情况而定。
在CSS语法上有不明白的，请善用网络资源。例如：不明白如何定义边框，可在 Google 输入“CSS 边框”来搜索。

每条说明的格式：CSS对象名称   说明
使用时的格式为：CSS对象名称  { 样式描述语句; }
列举条目的顺序：根据它们在CSS文件里的位置，从上到下。

页面总体默认样式（放在CSS的头部）：

a  链接样式。
a:hover     鼠标经过时的链接样式。
input  单行输入框以及按钮的样式。
textarea  多行输入框的样式。
a img  带链接的图片的样式。
.nickName  昵称的文字样式。
#wrap  整个页面区域的样式。注意它和body的区别：body是对整个浏览器窗口区域的定义，#wrap是对页面内容区域的定义。比如：当页面区域宽度小于浏览器窗口时，可以通过#wrap定义页面区域的位置（是否居中）和样式。
ul, ul li, ol, ol li  出现在CSS上方，定义内容通常是“ { list-style:none; }”， 牵扯到页面的各个导航和列表。慎重删改。
页面头部：

#header  页面头部区域样式，该区域包含：BLOG名称和BLOG描述。
#blogName  BLOG名称的链接样式。
#blogName a:hover  鼠标经过BLOG名称时的样式。
#blogDescription  BLOG描述语句的样式。
#blogDescription:hover  鼠标经过BLOG描述时的样式。
导航栏：

#navbar  导航栏区域的样式。即包含“首页”“日志”链接的那一行。慎重删改。
#navbar ul  同上。
#navbar ul li  同上。每个链接区域的样式。
#navbar ul li a  同上。单个链接本身的样式。
主数据区：

#content  页面主数据区的样式。主数据区，即：除了页面头部、导航栏、侧边栏、页面底部之外的，中间那一大块。
.component  页面主数据区的模块样式。视页面情况，默认在主数据区内有一个或多个模块，即BLOG文章模块，最新评论模块，以及“添加评论”模块。
.componentTitle  模块标题区域的样式。例如：单篇网志页面的“最新评论”和“发表评论”这两行标题文字。参见上文对“.component”的说明。
子导航栏：

#subNav  文章上方的子导航栏的区域样式。即：“BLOG名称>>日志>>日志名称”那一行。
#subNav a  同上。链接样式。
#subNav a:hover  同上。鼠标经过时的样式。
网志文章区域：

.postEntryNav  包含“上一篇”、“下一篇”链接的那一行的区域样式。
.postEntryNav .prev  “上一篇”的链接样式。
.postEntryNav .next  “下一篇”的链接样式。
.postEntry  每一篇网志的区域样式。
网志文章区域的标题：

.postEntry .title  网志标题样式。
.postEntry .title a  网志标题链接的样式。
.postEntry .title a:hover  同上，鼠标经过时的样式。
署名区域：

.postEntry .signature  网志署名区域的样式，包含作者和时间。即：“世玉 @ 2007-04-03 14:19”那一行。
.postEntry .signature .posterNickName  署名区域的作者名称样式。
.postEntry .signature .postTime  网志发表时间的样式。
网志正文：

.postEntry .content  单篇网志正文内容区域的样式。
.postEntry .content img  网志正文中的图片样式。
.postEntry .content a  网志正文中的链接样式。
.postEntry .content a:hover  鼠标经过时的链接样式。
.postEntry .content p  正文中单个段落的样式。
.postEntry .content ul  正文中无序列表的整体样式。我在此网志中列举这些CSS元素，用的就是无序列表。
.postEntry .content ul li  正文中列表的每一项的样式。
.postEntry .content ol 正文中有序列表的整体样式。有序列表和无序列表差不多，不同的是，每一项前面有标号。
.postEntry .content blockquote  网志正文中“引用”区域的样式。
关键词（Tags）区域：

.postEntry .tags  关键词区域的样式。
.postEntry .tags a  每个关键词的样式。
访问和评论数：

.postEntry .postEntryMeta  每篇网志的最后一行的区域，包含访问数和评论数等。
.postEntry .postEntryMeta .view  访问数的文字样式。但不能影响到链接。
.postEntry .postEntryMeta .reply  评论数的文字样式。同上。
.postEntry .postEntryMeta .folder  所属文件夹的文字样式。同上。
"曾经的这一天"：

.postEntry .dih  “曾经的这一天”区域的样式。
.postEntry .dih ul  该区域的链接列表整体样式。
.postEntry .dih ul li 单个链接区域样式。
.postEntry .dih a 单个链接文字样式。
文件夹网志列表：

.componentPostTitleList .componentBody ul  网志列表区域的样式。适用于：文件夹的网志列表页面。
.componentPostTitleList ul li  单个网志标题区域的样式。例如：单个文件夹的网志列表。
.componentPostTitleList ul li a  单个网志标题的链接样式。
.componentPostTitleList ul li span  单个网志标题的描述文字的样式。例如：发表时间，评论条数等。
.componentPostTitleList .sectionTitle  网志列表区域是按时间分段的，描述时间的文字区域样式。
单篇网志页面：

.componentReplyList .componentBody  单篇网志下面的“最新评论”区域，整体样式。
.componentReplyList .componentBody p  “评论”内容和“对评论的回复”的内容，文字样式。
.componentReplyList .componentBody ul li  每则评论区域的样式。（作为列表项，相当于外层）
每则评论的区域：

.replyEntryInfo  每则评论区域的样式。（作为包含于列表项内的层。相当于内层。）
.replyEntryMeta  评论区域第一行的样式，包含：评论者名称，评论时间，链接等。
.replyEntryMeta .replierNickName  评论者名称的文字样式。
.replyEntryMeta .replierNickName a  评论者名称的链接样式。
.replyEntryMeta .replierNickName a:hover  鼠标经过评论者名称时的样式。
.replyEntryMeta .replyTime  评论时间的文字样式。
.replyEntryInfo .content  评论内容区域的样式。如果“博主回复”区域没单独定义，则这里的定义对它也有效。
.replyEntryInfo .respond  “博主回复”区域的样式。
发表评论的区域：

.componentReplyForm .componentBody  单篇网志下“发表评论”区域的样式。
.componentReplyForm .componentBody th  每一个输入项 的名称样式。例如：“* 昵称”，“地址(URL)”等。
.componentReplyForm .componentBody input  单行输入框的默认样式。
.componentReplyForm #replyFormReplierUrl  网址的输入框样式。
.componentReplyForm #replyFormReplierEmail  邮箱的输入框样式。
.componentReplyForm #replyFormReplierNickName  昵称的输入框样式。
.componentReplyForm  textarea  评论内容的输入框的样式。
.componentReplyForm #replyFormSubmit  “发表评论”按钮的样式。
.componentReplyForm img  广告图片的样式。
侧边栏：

#sidebar  侧边栏的整体样式。
.module  每个模块的整体样式。
.module a  模块中的链接样式。
.module a:hover  模块中的链接在鼠标经过时的样式。
.moduleTitle  每个模块标题区域的样式。
.moduleBody  每个模块正文区域的样式。
.moduleBody ul  模块中列表的样式。比如：“文件夹”列表。
.moduleBody li  列表项的样式。比如：“文件夹”列表的每个文件夹名称。
“博主资料”模块：

.moduleAbout .moduleBody  “博主资料”模块的正文区域样式。
.moduleAbout .avatar img  博主头像图片的样式。
.moduleAbout .nick_name  博主名字的区域样式。
.moduleAbout .description  “博主介绍”区域的样式。
“日历”模块：

.moduleCalendar .moduleBody  日历模块的正文区域样式。
#calendarContainer table ...这一系列都是时间表的样式，太麻烦，不介绍了。
“最新评论”模块：

.moduleLastestReply .moduleBody ul  评论列表整体区域的样式。
.moduleLastestReply .moduleBody li 单个评论区域的样式。
.moduleLastestReplyInfo  单个评论的描述区域的样式。包括：昵称，时间等。
.moduleLastestReplyInfo .date  时间的文字样式。
.moduleLastestReplyInfo .nickName  昵称的文字样式。
“文件夹”模块：

.moduleFolder  整个该区域，包括标题。
.moduleFolder .moduleTitle  标题区域。
.moduleFolder .moduleBody ul   “文件夹”标题下面的内容区域的样式。
.moduleFolder .moduleBody li  单行的区域样式。
.moduleFolder .moduleBody li a  单个链接文字的样式。
.moduleFloder .moduleBody li span  文章数的阿拉伯数字样式。
“存档”模块：

.moduleArchive  整个该区域，包括标题。
.moduleArchive .moduleTitle  标题区域。
.moduleArchive .moduleBody ul    位于标题下面的内容区域的样式。
.moduleArchive .moduleBody li   单行的区域样式。
.moduleArchive .moduleBody li a    单个链接文字的样式。
.moduleArchive .moduleBody li .yearMonth   “年月”的链接样式。
.moduleArchive .moduleBody li .year   “年”的链接样式。

“计数器”模块：

.moduleStat li   单行的区域样式。

.moduleStat span  此模块的阿拉伯数字的样式。
“友情链接”模块：

.moduleLink .moduleBody ul  链接列表区域的整体样式。
.moduleLink .moduleBody li  每个链接区域的样式。
.moduleLink .moduleBody li a  单个链接文字的样式。
“搜索”模块:

.moduleSearch .moduleBody  “搜索”模块正文区域的样式。
.moduleSearch .moduleBody input  搜索框和按钮的默认样式。
.moduleSearch .moduleBody .query  搜索框的样式。
.moduleSearch .moduleBody .query:hover  鼠标经过时，搜索框的样式。
.moduleSearch .moduleBody .submit  搜索按钮的样式。
.moduleSearch .moduleBody .submit:hover  鼠标经过时，搜索按钮的样式。
“自写HTML代码”模块：

.moduleUserHTML  整个该区域，包括标题。
.moduleUserHTML .moduleTitle  标题区域。
.moduleUserHTML .moduleBody    位于标题下面的内容区域的样式。
“自写文字”模块：

.moduleUserText   整个该区域，包括标题。
.moduleUserText .moduleTitle  标题区域。
.moduleUserText .moduleBody    位于标题下面的内容区域的样式。
页号导航：

#pageNav  分页导航区域的样式。即页面底部的页号导航。
#pageNav a  页号链接样式。
#pageNav a:hover  鼠标经过时的链接样式。
#pageNav .current  当前页号的文字样式。
页面底部：

#footer  页脚区域的整体样式。此区域包含：“powered by YCULBlog.com”，等等。
#footer a  此区域的链接样式。

汗。花了我几个小时来搞这个东东。你们慰劳我一下吧，我累死了。
去吃饭了。o(∩_∩)o...

update(2007/04/07)：

对原文的改动：

更正“曾经的这一天”的 .today_in_history 为 .dih （汗，官方模板里也写错了）；
更正“友情链接”的 .moduleLinks 为 .moduleLink ；
增加“每则评论的区域”的 .replyEntryInfo .content 条目；
增加“博主资料”模块的 .moduleAbout .nick_name 条目；
修改了部分描述语言。
既然落落提到了，我就顺便解释一下系统预设的HTML对象：

#PAGE_HEADER# 和 #PAGE_FOOTER#  是HTML文件的头部和尾部，在页面中无显示。自定义HTML代码的时候，所有代码必须放在它们俩之间。
#HEADER#  页面的头部数据，即包含博客名称，博客描述文字的那块。
#NAVBAR#  页面的导航栏数据。即包含“首页”、“日志”、“RSS订阅”链接的那块。
#SIDEBAR#  侧边栏数据。你在模块管理页面中选择的或者自写的所有模块，都包含在这里了。
#CONTENT#  页面主数据，即：除了页面头部、导航栏、侧边栏、页面底部之外的，中间那一大块。