使用表格或div / css作为电子商务网站的购物篮/结账页面，请告诉我

Question

我必须为电子商务网站创建一个购物篮/结帐页面。关于<table>的所有这些争论，我很困惑。

看到在购物篮/结帐页面中，产品按行显示细节，并且有一些选项，例如删除/修改，我倾向于使用<table>，但我被告知远离它并且使用<div>/css。我的意思是，购物篮/结帐页面是关于产品的数据，所以我没有看到任何问题。

所以我问，我是否正确使用<table>或者我应该使用<div>/css来对齐产品？我再次谈论篮子/结账页面。

Answer 1

表可用于表格数据。但从长远来看，这真的取决于你。使用语义不是法律或规则。这只是最好的做法。我建议，如果你要显示一个有价格的产品“清单”，你可以把它标记为清单。如果您正在显示一个包含数字和信息的“数据驱动”页面，那么您应该使用表格。

从长远来看，这取决于你： - ）

Answer 2

在这个例子中你是正确的。如果你有一排排信息（或者甚至只有一行），那么从语义上来说，它就是完全合理的，更重要的是，从布局的角度来看，这样做。

替代方案将涉及太多的CSS cludge看起来相同，并将您的标记呈现为一堆类和div。

Answer 3

我坚持的一般规则是：

Div's for layout

---

表格数据的表格

---

这条规则不会出错：）

Answer 4

我知道这是一个非常古老的问题，但问题的真相是这些答案都不够。除非您提供有关您具体情况的更多详细信息，否则他们甚至没有进入他们的表格数据，所有人都能提供的是一般的经验法则。 （我知道你不会因为你因为你的特殊需要而长期处理这个案例，但对于其他任何人来到这里他们都会知道提供更多细节。）

那么什么是表格数据？我想我们都同意表格数据是数据，而不是设计元素。您可以在Excel工作表或数据库中找到数据。因此，在决定您的页面是否包含表格数据时，您可以决定是否拥有数据或设计元素。例如，checkout表是否有删除按钮？您是否会在Excel电子表格中提供有关删除按钮的数据？可能不是。

我看待它的方式是，如果您呈现的所有“数据”都被视为表格数据，那么为什么不将您网站上的产品页面变成一张大桌面呢？人们会皱眉。因此，当您查看“表格数据”时请考虑这一点。仅仅因为它看起来像一个表格，其格式类似于表格的外观，并不一定意味着你有表格数据。运输，订阅等选项可能会出现在用户帐户的表格中。所以你可能没事。