处理带表单的多个/复杂列的标准和最佳实践

Question

我想知道处理内部表单的多个复杂列的最佳实践或方法是什么。

这是我正在处理的表格的一个例子

如何为此正确编写HTML标记？如果我用每个列的'DIV'包装每个表单元素，它将需要很多'DIV'和样式;以及每个不重复的列的宽度。

所以我做的是，我将所有表单元素放在表中。而且我认为这不是标准的做法。

如果你在我的鞋子里，

您如何处理非重复宽度的列？

Answer 1

复杂表格没有标准，但有很多博客帖子声称找到了解决这个问题的完美方法。他们中的大多数都经过深思熟虑，但最终你必须选择一个你最熟悉的。我有一些建议：

• 查看美国邮政服务变更地址表。它出人意料地完成了

• 如果您有批次表单，使用960.gs，blueprint.css或YUI网格（shudder）等网格系统是实现表单的简便方法。 然而网格系统肯定被认为是膨胀，如果这是你将使用它们的唯一地方。

  • 在Google上搜索“无表格形式”。您将看到许多不同的实现。选择你喜欢的那个。

Answer 2

我可能会将每个表单元素放在一个无序列表中的列表项中（我认为在语义上，它是一个需要填充的输入元素列表。）

然后我会为它们添加类来定位和宽度等等 - 圆柱的需要给定宽度并向左浮动......

这样：

<ul>
   <li class="iName"><label for="name">Full name:</label><input name="name"/></li>
   <li class="iEmail"><label for="email">Email:</label><input name="email"/></li>
   etc etc...
</ul>

我相信这在语义上是正确的，并且是最容易理解的方式。