Css 显示基于列但似乎不以表格形式显示的数据的最佳方式是什么？

我试图在我的网页中做到语义正确，但不确定如何继续：

我的数据如下所示或需要：

Name:  lastname, first mi Address:  123 Main St.  City, State, Zip:  more...
Fieldx:  data1 Fieldy:  more data...

我不想要的是常规的表数据外观，顶部有列标题：

name                 Address
lastname, first mi   Some address...

我不知道该怎么做。当我查找无表CSS时，我只找到表单和布局

我应该使用CSS的表单布局（没有表格）……这不是一个“表单”吗

---

编辑：我是否只是将所有内容都放在一个div中，然后用float right将其放在跨距中？

我认为div是一个不错的选择。当与CSS结合使用时，div为您提供了更好的灵活性。

从结构上讲，您拥有的是一个名称/值对列表，它对应于一个两列表。它也可以被标记为

dl

元素，如果我们采用自由的现代解释，即

dl

实际上不是一个定义列表，而是一个描述列表，而描述列表实际上是一个名称/值对列表。它也可以标记为一个

ul

元素，其中每个

li

元素包含两个

span

元素（带类），但这样就失去了结构中类似数组的概念。最后，您可以使用一些

div

或

p

容器，其中包含带有交替类的

span

元素

所有这些都与语义（意义）无关。相反，它是关于结构的。而不是考虑哪种方法更“正确”，考虑哪种样式最适合（并且可能在处理中，例如在客户端脚本中）。如果您想要表格布局，使用表格是很自然的。（有些有趣的是，如果您不想要这样的布局，那么您可能不应该使用表格，因为旧版本的IE不允许您以非表格的方式设置

表格

元素的样式。）

如果您打算像示例中那样将数据作为内联文本，那么我将使用

<div class=foo>
<span class=name>Name</span> <span class=value>lastname, first mi</span>
<span class=name>Address</span> <span class=value>123 Main St. </span>
  ...
</div>

Name lastname，first mi
地址：缅因街123号。
...

---

这是一个有点冗长的标记，但是它可以很容易地设置样式，因为

div

和

span

没有默认的样式（除了

div

暗示前后换行），并且您可以方便地使用类选择器。

我不太明白您的设计是如何“基于列”的。您在第一个代码块中编写的只是一组内联文本，这将是默认的，不需要任何样式。使用基于

ul>li

的结构，您可以按照您想要的方式显示数据。看看这个例子：