在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 +类

我觉得这是divitis的情况和classitis集于一身。

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

div容器

这感觉更像是在正确的道路，但我不知道。

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

建议？

Answer 1

我认为你是对的在你说你想使用一个表，但不想使用。在这种情况下，我不认为一张桌子是正确的。我个人只使用表格，如果我需要很好地组织数据。因为你有这么多东西，所以到处都是一堆浮动div更麻烦，然后只是使用一张表。

因为这只有两列，我会说使用使用两个div与浮动或使用两个跨度，而不是强大的使用跨度，然后用css样式。

Answer 2

使用一个表格，这是少数几个使用表格实际上并不是所有错误的例子之一。你并没有将它用于布局，而是使用文本标记。

然后对每个第一列应用一个类，并在CSS中使该类具有适用于该列的text-align: right;。

Answer 3

这显然是何时使用表的一个很好的例子。

它是表格数据。

使用th s可以对第一列单元格进行样式设置。

我甚至认为th s默认为粗体。不知道所有的浏览器，但不会伤害他们的风格大胆肯定:)。

Answer 4

表格是以行和列排列数据的一种方式。

这就是你在做什么。

Answer 5

我认为这里的一个很好的语义选择是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> 

Answer 6

定义清单将是语义正确的。

<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> 

见W3C更多细节 - http://www.w3schools.com/tags/tag_dl.asp