<fieldset>: 字段集标签
最后更新：2026-10-13
<fieldset>字段集标签
将表单内的相关控件分组，并可用 legend 显示分组标题，提升可读性与可访问性。
| 分类 | 表单 |
|---|---|
| 内容模型 | 流式内容 |
| 允许的父元素 | 接受流式内容的元素 |
| 闭合标签 | 需要 </fieldset> 标签 |
| 状态 | 标准 |
📝 语法
<fieldset>
<legend>分组标题</legend>
...控件...
</fieldset>⚙️ 属性
该元素支持全局属性及以下专有属性：
| 属性 | 值 | 描述 |
|---|---|---|
name | 分组名（与表单一起提交）。 | |
disabled | 禁用分组内的所有控件。 | |
form | 关联的 form id。 |
▶ 示例
编辑下方代码，在 playground 中查看实时效果：
🌐 浏览器支持
| 浏览器 |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <fieldset> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| 所有主流浏览器均支持 | |||||
提示： fieldset 默认带边框，可用 CSS 去掉；禁用 fieldset 会连带禁用内部所有控件。
❓ 常见问题
Qfieldset 是做什么用的？
A
<fieldset> 把相关的表单控件分组（如「收货地址」一组、「支付方式」一组），默认带边框，配合 <legend> 提供组标题。屏幕阅读器会先朗读组名再朗读控件，长表单的可理解性大幅提升。Qfieldset 里的边框样式可以去掉吗？
A可以：
fieldset { border: none; padding: 0; margin: 0; }。去掉视觉样式不影响语义——分组和 legend 的无障碍价值依然保留，这是语义与样式解耦的典型例子。Qfieldset 的 disabled 属性有什么用？
A给
<fieldset> 加 disabled，组内所有控件一次性全部禁用（包括后代控件），适合「整块表单只读」场景，如订单确认步骤。比逐个给控件加 disabled 简洁得多。🏷️ 相关标签
💡 相关案例
更多案例即将上线，敬请期待。
📚 相关教程
