32

<fieldset>使用标签有什么好处？

我真的不明白它是用来做什么的。

4

4 回答 4

30

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

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

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

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

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

这与许多新的 HTML5 标记集的原理相似。<footer>例如，与模棱两可的<div>.

于 2011-06-29T12:03:41.637 回答
6

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

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

该fieldset元素表示一组表单控件，可选择地分组在一个通用名称下。

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

结合legendelementfieldset ，它可以让你轻松地做到这一点，如果不使用/就很难重新创建legend：

于 2011-06-29T12:04:48.420 回答
5

它允许您对一组相关字段进行分组并给它们一个图例。

<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>
于 2011-06-29T12:05:00.637 回答
1

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

此外，传说看起来很不错。

于 2011-06-29T12:03:58.030 回答