在CSS中处理这个简单示例的好方法是什么？

Question

假设我在某些页面上有以下布局:

               Title: Some Title   
              Author: Some Author   
Author Date of Birth: Date of birth

笔记:

• 左侧文本是右对齐和粗体.
• 用于几个不同的页面.
• 右侧可以包含某些输入控件.

在这种情况下适用的最合适的方法是什么？我可以想到几个选项(假设在外部样式表中应用了CSS):

表

简单,容易,但我不确定这会被认为是对表的好用.

<table>
 <tr>
  <td>Title</td>
  <td>Some Title</td>
 </tr>
</table>

Div + Classes

我觉得这是一个将divitis和classitis集于一身的案例.

<div class="information">
 <div class="title">Title</div><div class="value">Some Title</div>
</div>

集装箱分部

这感觉更像是正确的道路,但我不确定.

<div class="information">
 <strong>Title</strong> <span>Some Title</span>
</div>

建议？

Answer 1

我认为这里的一个好的语义选择是dl(描述列表)元素.

http://developers.whatwg.org/grouping-content.html#the-dl-element

<dl>
    <dt>Title</dt>
    <dd>Some Title</dd>

    <dt>Author</dt>
    <dd>Some Author</dd>

    <dt>Author Date of Birth</dt>
    <dd>Date of birth</dd>
</dl>