使用fieldset标签有什么优点？

Question

使用

标签有哪些优点？

我实在不明白它是做什么用的。

Answer 1

表单通常分为不同的字段集。

字段集标签允许您对字段集进行逻辑分组，以便您的表单更具描述性。

您还会注意到，您可以使用字段集来设计表单的样式并显示字段之间的逻辑关联。

就像您在“真实”世界中找到的形式一样。

使用字段集的“优点”是它们允许您以最可用的语义方式标记数据（在本例中为表单）。请考虑将字段放在字段集中比将字段放在 div 中更具描述性。 div 不会告诉您字段之间的关系，而字段集会告诉您存在某种关系。

这与许多新的 HTML5 标记集的原理类似。例如，与模糊的

相比，

可以告诉您更多有关其中数据含义的信息。

Answer 2

如果您查看面向开发人员的 HTML5 规范：

http://developers.whatwg.org/forms.html#the-fieldset-element

fieldset 元素表示一个集合
可选分组的表单控件
使用通用名称。

（如果您点击链接，会有更多信息）

与 legend 元素，它可以让你轻松地做到这一点，如果不使用 fieldset/legend 很难重新创建：

<图片src="https://i.sstatic.net/wQ8s2.png" alt="">

Answer 3

它允许您对一组相关字段进行分组并为它们提供图例。

<fieldset>
    <legend>Gender</legend>
    <input type="radio" name="gender" id="male" value="male">
    <label for="male">Male</label>
    <input type="radio" name="gender" id="female" value="female">
    <label for="female">Female</label>
<fieldset>

<fieldset>
    <legend>Address</legend>

    <label for="line1">Line 1</label>
    <input name="address1" id="line1">

    <label for="line2">Line 2</label>
    <input name="address2" id="line2">

    <label for="town">Town</label>
    <input name="town" id="town">

    <label for="country">country/label>
    <input name="country" id="country">
</fieldset>

Answer 4

你将东西与它组合在一起。如果您需要通过 CSS 或 JavaScript 访问其中的内容，并且不想经历为所有内容分配 ID 的麻烦，那么这会很有用。

而且，传说看起来也不错。