HTML评论标记

Question

我目前正在创建自己的博客，我必须标记评论，但是标记它的最佳方法是什么？

我需要提供的信息是：

1. 人名
2. Gravatar图标
3. 评论日期
4. 评论

任何想法都会受到很多关注。

PS：我只对语义html标记感兴趣。

Answer 1

我认为你的cite，blockquote等版本肯定会有效，但如果语义是你的主要关注点，那么我个人不会使用cite和blockquote，因为它们具有它们应该代表的特定事物。

blockquote标签用于表示从其他来源获取的报价，而cite标签用于表示信息来源（如杂志，报纸等）。

我认为一个论证肯定可以使用语义HTML和类名，只要它们有意义。 这篇关于Plain Old Semantic HTML的文章提到了使用类名 - http://www.fooclass.com/plain_old_semantic_html

Answer 2

以下是使用以下CSS将图片浮动到内容左侧的一种方法：

 .comment { width: 400px; } .comment_img { float: left; } .comment_text, .comment_meta { margin-left: 40px; } .comment_meta { clear: both; } 

 <div class='comment' id='comment_(comment id #)'> <div class='comment_img'> <img src='https://placehold.it/100' alt='(Commenter Name)' /> </div> <div class='comment_text'> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p> <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p> </div> <p class='comment_meta'> By <a href='#'>Name</a> on <span class='comment_date'>2008-08-21 11:32 AM</span> </p> </div> 

Answer 3

我不知道有没有使用div或类而且必须代表注释结构的标记，但你可以使用定义列表。 您可以在定义列表的上下文中使用多个dt和dd标记 - http://www.w3.org/TR/html401/struct/lists.html#edef-DL

<dl>
  <dt>By [Name] at 2008-01-01<dt>
  <dd><img src='...' alt=''/></dd>
  <dd><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p>

  <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p>
   </dd>
</dl>

更新：我对这种方法的关注是，为了样式目的，用CSS唯一地识别元素可能很困难。 您可以使用JavaScript（jQuery在这里很棒）来查找和应用样式。 如果没有跨浏览器（IE）的完整CSS选择器支持，那么风格会更难。

Answer 4

我或许想到这样的事情：

<ol class="comments">
    <li>
        <a href="">
            <img src="" alt="" />
        </a>
        <cite>Name<br />Date</cite>
        <blockquote>Comment</blockquote>
    </li>
</ol>

没有使用div和只有一个类，它是非常语义的。 列表显示了评论的顺序，人员网站的链接，他们的重力图像，网站的引用标签，评论和阻止他们说的话。

人们怎么想？

Answer 5

我明白你的意思。 好的，看完那篇文章后，你为什么不尝试这样的东西呢？

<blockquote 
    cite="http://yoursite/comments/feederscript.php?id=commentid" 
    title="<?php echo Name . " - " . Date ?>" >
    <?php echo Comment ?>
</blockquote>

用一些时髦的CSS让它看起来不错。

feederscript.php将是一个可以从数据库中读取的东西，只回应所要求的纪念品。