2009年05月11日 8条评论

WP2.7新评论功能的CSS定义

自从完成 zFirst 0.9后,一直不太明白怎么自定义 wordpress 2.7 新评论功能的 CSS(我的评论样式只是简单定义了),今天闲逛到 aoogo 那,有篇文章《让您的主题支持WP2.7新留言评论功能》,里面就有我所需的东东。下面是 wordpress 2.7 新评论CSS部分的一套配色方案,使用新评论的朋友可以直接复制到 style.css 里修改:

ol.commentlist { list-style:none; margin:0 0 1em; padding:0; text-indent:0; }
ol.commentlist li { }
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment { border-bottom:1px dotted #666; padding:1em; }
ol.commentlist li div.comment-author {}
ol.commentlist li div.vcard { font:normal 16px georgia,times,serif; }
ol.commentlist li div.vcard cite.fn { font-style:normal; }
ol.commentlist li div.vcard cite.fn a.url {}
ol.commentlist li div.vcard img.avatar { border:5px solid #ccc; float:right; margin:0 0 1em 1em; }
ol.commentlist li div.vcard img.avatar-32 {}
ol.commentlist li div.vcard img.photo {}
ol.commentlist li div.vcard span.says {}
ol.commentlist li div.commentmetadata {}
ol.commentlist li div.comment-meta { font-size:9px; }
ol.commentlist li div.comment-meta a { color:#ccc; }
ol.commentlist li p { font-size:11px; margin:0 0 1em; }
ol.commentlist li ul { font-size:11px; list-style:square; margin:0 0 1em 2em; }
ol.commentlist li div.reply { font-size:11px; }
ol.commentlist li div.reply a { font-weight:bold; }
ol.commentlist li ul.children { list-style:none; margin:1em 0 0; text-indent:0; }
ol.commentlist li ul.children li {}
ol.commentlist li ul.children li.alt {}
ol.commentlist li ul.children li.bypostauthor {}
ol.commentlist li ul.children li.byuser {}
ol.commentlist li ul.children li.comment {}
ol.commentlist li ul.children li.comment-author-admin {}
ol.commentlist li ul.children li.depth-2 { border-left:5px solid #555; margin:0 0 .25em .25em; }
ol.commentlist li ul.children li.depth-3 { border-left:5px solid #999; margin:0 0 .25em .25em; }
ol.commentlist li ul.children li.depth-4 { border-left:5px solid #bbb; margin:0 0 .25em .25em; }
ol.commentlist li ul.children li.depth-5 {}
ol.commentlist li ul.children li.odd {}
ol.commentlist li.even { background:#fff; }
ol.commentlist li.odd { background:#f6f6f6; }
ol.commentlist li.parent { border-left:5px solid #111; }
ol.commentlist li.pingback { border-bottom:1px dotted #666; padding:1em; }
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}

其实这些是aoogo引自 Chris Harrison提供的 CSS 部分配色方案,还可以去 Chris Harrison参考提供的几种配色方案。

zww
or
oooo

“WP2.7新评论功能的CSS定义”有8条评论

  1. 小T says:

    最近在改评论一直搞不定,都怪自己的技术太差了,哪天zwwooooo指导一下,才发现你的评论有居中效果

  2. 林晨 says:

    也看不出什么东西来,还是自己慢慢研究

  3. 吖Bee says:

    看了《让您的主题支持WP2.7新留言评论功能》,我才明白说什么东东~

  4. zwwooooo says:

    @小T 评论部分还是觉得复杂,刚才折腾到最后还是回归原来的

    @林晨 难道和 吖Bee 一样要看了原文才知道啥?都怪自己懒没加注析

    @吖Bee 呵呵,早知道把文章转过来,但又不喜欢转载文章。

  5. 如何做到像您这样统一评论呢?

  6. ligyxy says:

    这些我也曾用过,感觉最大的问题就是嵌套回复的时候输入框大小不变,以至于超出了最大的留言框。
    怎么修改…我就不会了…

  7. zwwooooo says:

    @左岸读书 插件啊,Mail To Commenter,可以统一用“@”回复而且都有邮件通知

    @ligyxy 呵呵,我的不会的,会根据嵌套自动缩小的,还有一般设置嵌套个数不要超过5,超过5个嵌套框框就太小了

  8. ligyxy says:

    你这么有空啊!有时间真好……

回复给 左岸读书 ¬
取消回复

昵称 *

网址

B em del U Link Code Quote