HTML评论标记

Question

我目前正在创建自己的博客的过程中，我必须标记注释，但标记它的最佳方式是什么？

我需要呈现的信息是：

1. 人名称
2. Gravatar图标
3. 意见日期
4. 的评论

任何想法的将大大appriciated。

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

Answer 1

我认为你的版本与引用，blockquote等肯定会起作用，但是如果语义是你主要关注的话，那么我个人不会使用引用和blockquote，因为它们有他们应该表示的特定事物。

blockquote标记是为了表示从另一个来源引用的引用，而引用标记是为了表示信息来源（如杂志，报纸等）。

我认为一个论据当然可以使你可以使用带有类名的语义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的，只有一个班。该列表显示了评论的顺序，人员网站的链接，以及他们的gravatar图像，引用标签的网站谁说评论和blockquote持有他们所说的。

人们认为什么？

Answer 5

我明白了你的观点。好吧，读过那篇文章后，为什么你不尝试这样的事情？

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

与一些时髦的CSS，使它看起来不错。

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