- <fieldset> 标签用于对表单中的控制元素进行分组(也包括 label 元素)
属性 |
说明 |
disabled |
如果设置了这个 bool 值属性,<fieldset> 的所有子代表单控件也会继承这个属性。这意味着它们不可编辑,也不会随着 <form> 一起提交。它们也不会接收到任何浏览器事件,如鼠标点击或与聚焦相关的事件。默认情况下,浏览器会将这样的控件展示为灰色。注意,<legend> 中的表单元素不会被禁用。 |
form |
将该值设为一个 <form> 元素的 id 属性值以将 <fieldset> 设置成这个 <form> 的一部分。 |
name |
元素分组的名称 |
- <legend> 标签用于表示其父元素 <fieldset> 的内容标题
示例
<!DOCTYPE html> <html lang="en">
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head>
<body> <form> <fieldset> <legend>Choose your favorite monster</legend> <input type="radio" id="kraken" name="monster"> <label for="kraken">Kraken</label><br />
<input type="radio" id="sasquatch" name="monster"> <label for="sasquatch">Sasquatch</label><br />
<input type="radio" id="mothman" name="monster"> <label for="mothman">Mothman</label> </fieldset> </form> </html> |
浏览器运行结果如下:
来自 <https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/fieldset>