标签分组 ‹fieldset› ‹legend›

Exisi 2020-06-07 17:05:15
Categories: Tags:

 

属性

说明

disabled

如果设置了这个 bool 值属性,<fieldset> 的所有子代表单控件也会继承这个属性。这意味着它们不可编辑,也不会随着 <form> 一起提交。它们也不会接收到任何浏览器事件,如鼠标点击或与聚焦相关的事件。默认情况下,浏览器会将这样的控件展示为灰色。注意,<legend> 中的表单元素不会被禁用。

form

将该值设为一个 <form> 元素的 id 属性值以将 <fieldset> 设置成这个 <form> 的一部分。

name

元素分组的名称

 

示例

<!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>