多个水平对齐的输入框，下方带有垂直对齐的标签

【问题标题】：multiple horizontally aligned input boxes with vertically aligned labels underneath多个水平对齐的输入框，下方带有垂直对齐的标签
【发布时间】：2012-02-10 13:42:19
【问题描述】：

我想创建一个类似于this one.的表单

特别是，我想学习如何将不同大小的输入框放在同一行，并在其下放置垂直对齐的标签。例如，在表单的“名称”部分，它有一个用于“第一个”和“最后一个”的框。

如何使用 HTML 和 CSS 做到这一点？

【问题讨论】：

标签： forms alignment

【解决方案1】：

您的示例表单包含将display 属性设置为inline-block 的SPAN 元素，并且INPUT 和LABEL 元素的显示属性值为block，并具有固定大小。这样，您基本上是在创建单元格来包含您的元素及其标签。

同样的事情可以使用 TABLE/TR/TD 组合来实现，虽然它会有点过时，因此不推荐。

【讨论】：

没问题。不客气。 :) 我希望你能回来为社区做出贡献。