jquery - 通过css形成顶部带有标签的水平布局

Question

我想要一个表单，其中有几个水平选择控件（它们彼此相邻）布局，并且在每个选择的顶部都有标签。

像这样：

带有标签的内联表单字段位于顶部

如何使用 css 和 dform 做到这一点？

Answer 1

我认为最好只使用无序列表。

将 LI 元素浮动到左侧并给它们一些margin-right 以分隔它们。

您需要在 UL 上使用 clearfixer 元素或其父元素以确保浮动有效。

<ul>

<li><label>Label #1</label>
<select>
<option></option>
</select>
</li>

<li><label>Label #1</label>
<select>
<option></option>
</select>
</li>

<li><label>Label #1</label>
<select>
<option></option>
</select>
</li>

</ul>

Answer 2

这是使用 dform 的答案。谢谢你的反对票。

跨度的 css... 显示：内联块标签和选择... 显示：块

$('#myform').dform({ "action" : "dform.html", "method" : "get", "html" : [
{ "type": "span", "html": { "type": "select", "name": "Country", "caption": "Country", "class": "countries", "options": { "": "All", "USA": { "html": "USA", "class": "active" }, "Germany": { "html": "Germany", "class": "active" }, "France": { "html": "France", "class": "active" } }, "selected": null } } ] });