HTML：活文档标准
面向 Web 开发人员版本 — 最后更新于 2024 年 9 月 12 日
面向 Web 开发人员版本 — 最后更新于 2024 年 9 月 12 日
button 元素所有当前引擎都支持。
tabindex 属性的后代。disabled — 表单控件是否被禁用form — 将元素与 form 元素关联formaction — 用于 表单提交 的 URLformenctype — 用于 表单提交 的 条目列表 编码类型formmethod — 用于 表单提交 的变体formnovalidate — 绕过表单控件验证以进行 表单提交formtarget — 用于 表单提交 的 可导航name — 用于 表单提交 和 form.elements API 的元素名称popovertarget — 目标弹出窗口元素以切换、显示或隐藏popovertargetaction — 指示目标弹出窗口元素是否要切换、显示或隐藏type — 按钮类型value — 用于 表单提交 的值HTMLButtonElement。该元素是一个 按钮。
type 属性控制按钮激活时的行为。它是一个 枚举属性，具有以下关键字和状态
| 关键字 | 状态 | 简要描述 |
|---|---|---|
submit
| 提交按钮 | 提交表单。 |
reset
| 重置按钮 | 重置表单。 |
button
| 按钮 | 不执行任何操作。 |
该属性的 缺失值默认值 和 无效值默认值 均为 提交按钮 状态。
如果 type 属性处于 提交按钮 状态，则该元素专门是 提交按钮。
form 属性用于显式地将 button 元素与其 表单所有者 关联。 name 属性表示元素的名称。 disabled 属性用于使控件无法交互并阻止其值被提交。 formaction、formenctype、formmethod、formnovalidate 和 formtarget 属性是 表单提交属性。
formnovalidate 属性可用于创建不会触发约束验证的提交按钮。
如果元素的 type 属性不处于 提交按钮 状态，则不得指定 formaction、formenctype、formmethod、formnovalidate 和 formtarget。
value 属性为表单提交提供元素的值。元素的 值 是元素的 value 属性的值（如果存在），否则为空字符串。
只有在使用按钮本身启动表单提交时，按钮（及其值）才会包含在表单提交中。
以下按钮标记为“显示提示”，并在激活时弹出对话框
< button type = button
onclick = "alert('This 15-20 minute piece was composed by George Gershwin.')" >
Show hint
</ button > select 元素所有当前引擎都支持。
option、optgroup、hr 和 支持脚本 元素。autocomplete — 表单自动填充功能的提示disabled — 表单控件是否被禁用form — 将元素与 form 元素关联multiple — 是否允许多个值name — 用于 表单提交 和 form.elements API 的元素名称required — 控件对于 表单提交 是否必填size — 控件的大小multiple 属性或 size 属性且其值为 > 1：面向作者；面向实现者。HTMLSelectElement。select 元素表示一个用于在一组选项中进行选择的控件。
所有当前引擎都支持。
multiple 属性是一个 布尔属性。如果该属性存在，则 select 元素 表示一个控件，用于从 选项列表 中选择零个或多个选项。如果该属性不存在，则 select 元素 表示一个控件，用于从 选项列表 中选择单个选项。
所有当前引擎都支持。
size 属性指定向用户显示的选项数量。如果指定了 size 属性，则其值必须是大于零的 有效非负整数。
select 元素的 选项列表 由 select 元素的所有 option 元素子节点以及 select 元素的所有 optgroup 元素子节点的所有 option 元素子节点组成，按照 树状顺序排列。
所有当前引擎都支持。
required 属性是一个 布尔属性。当指定该属性时，用户必须在提交表单之前选择一个值。
如果 select 元素指定了 required 属性，未指定 multiple 属性，并且 显示大小为 1；并且如果 select 元素的 选项列表 中第一个 option 元素的 值（如果存在）为空字符串，并且该 option 元素的父节点是 select 元素（而不是 optgroup 元素），则该 option 是 select 元素的 占位符标签选项。
如果 select 元素指定了 required 属性，未指定 multiple 属性，并且 显示大小为 1，则 select 元素必须具有 占位符标签选项。
实际上，上一段中陈述的要求仅在 select 元素没有 size 属性且其值大于 1 时才适用。
form 属性用于显式地将 select 元素与其 表单所有者 关联。name 属性表示元素的名称。disabled 属性用于使控件无法交互并阻止其值被提交。autocomplete 属性控制用户代理提供自动填充行为的方式。
select.type如果元素具有 multiple 属性，则返回“select-multiple”，否则返回“select-one”。
select.options返回 选项列表 的 HTMLOptionsCollection。
select.length [ = value ]返回 选项列表 中元素的数量。
element = select.item(index)select[index]element = select.namedItem(name)返回 选项列表 中第一个 ID 或 name 为 name 的项目。
如果找不到具有该 ID 的元素，则返回 null。
select.add(element [, before ])在由 before 指定的节点之前插入 element。
before 参数可以是数字，在这种情况下，element 将插入该数字指定的项目之前；也可以是 选项列表 中的元素，在这种情况下，element 将插入该元素之前。
如果省略 before、before 为 null 或数字超出范围，则 element 将添加到列表的末尾。
如果 element 是要将其插入的元素的祖先，则此方法将抛出一个 “HierarchyRequestError” DOMException。
select.selectedOptions返回选定 选项列表 的 HTMLCollection。
select.selectedIndex [ = value ]返回第一个选定项目的索引（如果存在），如果不存在选定项目，则返回 −1。
可以设置该属性以更改选择。
select.value [ = value ]返回第一个选定项目的 值（如果存在），如果不存在选定项目，则返回空字符串。
可以设置该属性以更改选择。
select.showPicker()显示 select 的任何适用的选择器 UI，以便用户可以选择值。
如果 select 不是 可变的，则抛出一个 “InvalidStateError” DOMException。
如果在没有 短暂的用户激活 的情况下调用，则抛出一个 “NotAllowedError” DOMException。
如果 select 在跨源 iframe 内部，则抛出一个 “SecurityError” DOMException。
如果 select 未 正在渲染，则抛出一个 “NotSupportedError” DOMException。
以下示例演示了如何使用 select 元素为用户提供一组选项，用户可以从中选择一个选项。默认选项已预先选中。
< p >
< label for = "unittype" > Select unit type:</ label >
< select id = "unittype" name = "unittype" >
< option value = "1" > Miner </ option >
< option value = "2" > Puffer </ option >
< option value = "3" selected > Snipey </ option >
< option value = "4" > Max </ option >
< option value = "5" > Firebot </ option >
</ select >
</ p > 如果没有默认选项，则可以使用占位符代替。
< select name = "unittype" required >
< option value = "" > Select unit type </ option >
< option value = "1" > Miner </ option >
< option value = "2" > Puffer </ option >
< option value = "3" > Snipey </ option >
< option value = "4" > Max </ option >
< option value = "5" > Firebot </ option >
</ select > 在这里，用户可以选择任意数量的选项。默认情况下，所有五个选项都已选中。
< p >
< label for = "allowedunits" > Select unit types to enable on this map:</ label >
< select id = "allowedunits" name = "allowedunits" multiple >
< option value = "1" selected > Miner </ option >
< option value = "2" selected > Puffer </ option >
< option value = "3" selected > Snipey </ option >
< option value = "4" selected > Max </ option >
< option value = "5" selected > Firebot </ option >
</ select >
</ p > 有时，用户必须选择一个或多个项目。此示例显示了这样的界面。
< label >
Select the songs from that you would like on your Act II Mix Tape:
< select multiple required name = "act2" >
< option value = "s1" > It Sucks to Be Me (Reprise)
< option value = "s2" > There is Life Outside Your Apartment
< option value = "s3" > The More You Ruv Someone
< option value = "s4" > Schadenfreude
< option value = "s5" > I Wish I Could Go Back to College
< option value = "s6" > The Money Song
< option value = "s7" > School for Monsters
< option value = "s8" > The Money Song (Reprise)
< option value = "s9" > There's a Fine, Fine Line (Reprise)
< option value = "s10" > What Do You Do With a B.A. in English? (Reprise)
< option value = "s11" > For Now
</ select >
</ label > 偶尔，使用分隔符可能很有用。
< label >
Select the song to play next:
< select required name = "next" >
< option value = "sr" > Random
< hr >
< option value = "s1" > It Sucks to Be Me (Reprise)
< option value = "s2" > There is Life Outside Your Apartment
…datalist 元素option 和 支持脚本 元素。HTMLDataListElement。
`datalist` 元素表示一组 `option` 元素，这些元素代表其他控件的预定义选项。在渲染中，`datalist` 元素本身不显示任何内容。
`datalist` 元素可以以两种方式使用。在最简单的情况下，`datalist` 元素仅包含 `option` 元素作为子元素。
< label >
Animal:
< input name = animal list = animals >
< datalist id = animals >
< option value = "Cat" >
< option value = "Dog" >
</ datalist >
</ label > 在更复杂的情况下，`datalist` 元素可以包含一些内容，这些内容用于不支持 `datalist` 的低版本客户端显示。在这种情况下，`option` 元素位于 `datalist` 元素内部的 `select` 元素中。
< label >
Animal:
< input name = animal list = animals >
</ label >
< datalist id = animals >
< label >
or select from the list:
< select name = animal >
< option value = "" >
< option > Cat
< option > Dog
</ select >
</ label >
</ datalist > `datalist` 元素通过 `input` 元素上的 `list` 属性与 `input` 元素关联。
`datalist` 元素的每个 `option` 子元素，只要它没有禁用，并且其值是一个非空字符串，就表示一个建议。每个建议都有一个值和一个标签。
datalist.options返回一个 `HTMLCollection`，其中包含 `datalist` 元素的 `option` 元素。
optgroup` 元素所有当前引擎都支持。
select` 元素的子元素。option` 和支持脚本的元素。optgroup` 元素紧跟在另一个 `optgroup` 元素之后，或者紧跟在 `hr` 元素之后，或者父元素中没有更多内容，则可以省略 `optgroup` 元素的结束标签。disabled` - 表单控件是否被禁用label` - 用户可见的标签`optgroup` 元素表示一组具有共同标签的 `option` 元素。
该元素的 `option` 元素组由 `optgroup` 元素的 `option` 子元素组成。
所有当前引擎都支持。
`disabled` 属性是一个布尔属性，可用于禁用一组 `option` 元素。
`label` 属性必须指定。其值用于用户界面中显示组的名称。
无法选择 `optgroup` 元素。只有 `option` 元素才能被选中。`optgroup` 元素仅为一组 `option` 元素提供标签。
以下代码片段演示了如何在 `select` 下拉列表控件中提供来自三个课程的一组课程：
< form action = "courseselector.dll" method = "get" >
< p > Which course would you like to watch today?
< p >< label > Course:
< select name = "c" >
< optgroup label = "8.01 Physics I: Classical Mechanics" >
< option value = "8.01.1" > Lecture 01: Powers of Ten
< option value = "8.01.2" > Lecture 02: 1D Kinematics
< option value = "8.01.3" > Lecture 03: Vectors
< optgroup label = "8.02 Electricity and Magnetism" >
< option value = "8.02.1" > Lecture 01: What holds our world together?
< option value = "8.02.2" > Lecture 02: Electric Field
< option value = "8.02.3" > Lecture 03: Electric Flux
< optgroup label = "8.03 Physics III: Vibrations and Waves" >
< option value = "8.03.1" > Lecture 01: Periodic Phenomenon
< option value = "8.03.2" > Lecture 02: Beats
< option value = "8.03.3" > Lecture 03: Forced Oscillations with Damping
</ select >
</ label >
< p >< input type = submit value = "▶ Play" >
</ form > option` 元素所有当前引擎都支持。
select` 元素的子元素。datalist` 元素的子元素。optgroup` 元素的子元素。label` 属性和 `value` 属性：无内容。label` 属性但没有 `value` 属性：文本。label` 属性，并且不是 `datalist` 元素的子元素：文本，不包括元素间空白字符。label` 属性，并且是 `datalist` 元素的子元素：文本。option` 元素紧跟在另一个 `option` 元素之后，或者紧跟在 `optgroup` 元素之后，或者紧跟在 `hr` 元素之后，或者父元素中没有更多内容，则可以省略 `option` 元素的结束标签。disabled` - 表单控件是否被禁用label` - 用户可见的标签selected` - 选项是否默认选中value` - 用于表单提交的值`option` 元素表示 `select` 元素中的选项，或者作为 `datalist` 元素中建议列表的一部分。
在 `select` 元素定义中描述的某些情况下，`option` 元素可以是 `select` 元素的占位符标签选项。一个占位符标签选项并不表示实际的选项，而是表示 `select` 控件的标签。
所有当前引擎都支持。
`disabled` 属性是一个布尔属性。如果 `option` 元素的 `disabled` 属性存在，或者它是 `optgroup` 元素（其 `disabled` 属性存在）的子元素，则该 `option` 元素被认为是禁用的。
`label` 属性为元素提供标签。`option` 元素的标签是 `label` 内容属性的值（如果存在且其值不是空字符串），否则为元素的 `text` IDL 属性的值。
如果指定了 `label` 内容属性，则其值不能为空。
`value` 属性为元素提供值。`option` 元素的值是 `value` 内容属性的值（如果存在），否则为元素的 `text` IDL 属性的值。
`selected` 属性是一个布尔属性。它表示元素的默认选中状态。
如果 `select` 元素没有指定 `multiple` 属性，则其 `option` 子元素中，其 `selected` 属性设置为 `true` 的元素不能超过一个。
option.selected如果元素被选中，则返回 `true`，否则返回 `false`。
可以设置此属性，以覆盖元素的当前状态。
option.indexoption.form
返回元素的表单元素（如果存在），否则返回null。
option.text与textContent相同，但空格会被折叠，并且脚本元素会被跳过。
option = new Option([ text [, value [, defaultSelected [, selected ] ] ] ])返回一个新的option元素。
text 参数设置元素的内容。
value 参数设置value属性。
defaultSelected 参数设置selected属性。
selected 参数设置元素是否被选中。如果省略此参数，即使 defaultSelected 参数为 true，元素也不会被选中。
textarea 元素所有当前引擎都支持。
autocomplete — 表单自动填充功能的提示cols — 每行的最大字符数dirname — 用于发送元素方向性的表单控件名称，用于表单提交disabled — 表单控件是否禁用form — 将元素与表单元素关联maxlength — 值的最大长度minlength — 值的最小长度name — 元素的名称，用于表单提交和form.elements APIplaceholder — 在表单控件内放置的用户可见标签readonly — 是否允许用户编辑值required — 表单提交时控件是否必填rows — 要显示的行数wrap — 表单控件的值如何换行以进行表单提交HTMLTextAreaElement。textarea 元素表示一个多行纯文本编辑控件。控件的内容表示控件的默认值。
readonly 属性是一个布尔属性，用于控制用户是否可以编辑文本。
在此示例中，文本控件被标记为只读，因为它表示只读文件
Filename: < code > /etc/bash.bashrc</ code >
< textarea name = "buffer" readonly >
# System-wide .bashrc file for interactive bash(1) shells.
# To enable the settings / commands in this file for login shells as well,
# this file has to be sourced in /etc/profile.
# If not running interactively, don't do anything
[ -z "$PS1" ] && return
...</ textarea > cols 属性指定每行的预期最大字符数。如果指定了cols 属性，则其值必须大于零的有效非负整数。
rows 属性指定要显示的行数。如果指定了rows 属性，则其值必须大于零的有效非负整数。
wrap 属性是一个枚举属性，具有以下关键字和状态
| 关键字 | 状态 | 简要描述 |
|---|---|---|
soft
| Soft | 提交时不换行（尽管在渲染时仍然可以换行）。 |
hard
| Hard | 文本将由用户代理添加换行符，以便在提交时换行。 |
如果元素的wrap 属性处于Hard状态，则必须指定cols 属性。
maxlength 属性是表单控件 maxlength 属性。
如果textarea 元素具有最大允许值长度，则元素的子元素必须使得元素的值的后代文本内容（换行符已规范化）小于或等于元素的最大允许值长度。
minlength 属性是表单控件 minlength 属性。
required 属性是一个布尔属性。当指定时，用户将需要在提交表单之前输入一个值。
placeholder 属性表示一个简短的提示（一个单词或短语），旨在在控件没有值时帮助用户输入数据。提示可以是示例值或预期格式的简要说明。
placeholder 属性不应作为标签的替代方案使用。对于较长的提示或其他建议文本，title 属性更合适。
这些机制非常相似，但细微差别：控件的标签提供的提示始终显示；placeholder 属性中给出的简短提示在用户输入值之前显示；title 属性中的提示在用户请求更多帮助时显示。
name 属性表示元素的名称。dirname 属性控制如何提交元素的方向性。disabled 属性用于使控件无法交互并阻止其值被提交。form 属性用于显式地将textarea 元素与其表单所有者关联。autocomplete 属性控制用户代理如何提供自动填充行为。
textarea.type返回字符串“textarea”。
textarea.value返回元素的当前值。
可以设置，以更改值。
这是一个textarea在表单中用于无限制自由格式文本输入的示例
< p > If you have any comments, please let us know: < textarea cols = 80 name = comments ></ textarea ></ p > 要为注释指定最大长度，可以使用maxlength 属性
< p > If you have any short comments, please let us know: < textarea cols = 80 name = comments maxlength = 200 ></ textarea ></ p > 要提供默认值，可以在元素内部包含文本
< p > If you have any comments, please let us know: < textarea cols = 80 name = comments > You rock!</ textarea ></ p > 您还可以提供最小长度。在这里，用户需要填写一个字母；提供了一个模板（短于最小长度），但不足以提交表单
< textarea required minlength = "500" > Dear Madam Speaker,
Regarding your letter dated ...
...
Yours Sincerely,
...</ textarea > 还可以提供一个占位符，向用户建议基本表单，而不提供明确的模板
< textarea placeholder = "Dear Francine,
They closed the parks this week, so we won't be able to
meet your there. Should we just have dinner?
Love,
Daddy" ></ textarea > 要让浏览器连同值一起提交元素的方向性，可以指定dirname 属性
< p > If you have any comments, please let us know (you may use either English or Hebrew for your comments):
< textarea cols = 80 name = comments dirname = comments.dir ></ textarea ></ p > output 元素所有当前引擎都支持。
for — 指定计算输出结果所控制的元素form — 将元素与form 元素关联name — 用于form.elements API 中的元素名称。HTMLOutputElement。output 元素表示应用程序执行计算的结果，或用户操作的结果。
此元素可以与samp 元素形成对比，后者是用于引用先前运行的其他程序输出的合适元素。
所有当前引擎都支持。
for 内容属性允许在计算结果与表示输入计算值的元素或以其他方式影响计算的元素之间建立显式关系。如果指定了for 属性，则其必须包含一个字符串，该字符串由一组无序的唯一空格分隔的标记组成，其中任何标记都不与其他标记相同，并且每个标记的值都必须是同一树中某个元素的ID。
form 属性用于将output 元素与其表单所有者显式关联。name 属性表示元素的名称。output 元素与表单关联，以便可以轻松地从表单控件的事件处理程序中引用它；当提交表单时，元素的值本身不会被提交。
output.value [ = value ]返回元素的当前值。
可以设置，以更改值。
output.defaultValue [ = value ]返回元素的当前默认值。
可以设置，以更改默认值。
output.type返回字符串“output”。
一个简单的计算器可以使用output 来显示计算结果
< form onsubmit = "return false" oninput = "o.value = a.valueAsNumber + b.valueAsNumber" >
< input id = a type = number step = any > +
< input id = b type = number step = any > =
< output id = o for = "a b" ></ output >
</ form > 在此示例中，output 元素用于报告远程服务器执行的计算结果（随着结果的陆续返回）。
< output id = "result" ></ output >
< script >
var primeSource = new WebSocket( 'ws://primes.example.net/' );
primeSource. onmessage = function ( event) {
document. getElementById( 'result' ). value = event. data;
}
</ script > progress 元素所有当前引擎都支持。
progress 元素的后代。value — 元素的当前值max — 范围的上限HTMLProgressElement。progress 元素表示任务的完成进度。进度可以是不确定的，表示正在取得进展，但尚不清楚在任务完成前还有多少工作要做（例如，因为任务正在等待远程主机响应），或者进度是介于零到最大值之间的数字，表示迄今为止已完成的工作的比例。
所有当前引擎都支持。
有两个属性决定了元素表示的当前任务完成情况。value 属性指定已完成多少任务，max 属性指定任务总共需要多少工作。单位是任意的，未指定。
要创建确定性进度条，请添加value 属性，并设置当前进度（可以是 0.0 到 1.0 之间的数字，或者，如果指定了max 属性，则可以是 0 到max 属性值的数字）。要创建不确定性进度条，请删除value 属性。
鼓励作者也将当前值和最大值作为文本内联到元素中，以便使旧版用户代理的用户也能获取进度信息。
这是一个显示某些自动化任务进度的 Web 应用程序代码片段
< section >
< h2 > Task Progress</ h2 >
< p > Progress: < progress id = p max = 100 >< span > 0</ span > %</ progress ></ p >
< script >
var progressBar = document. getElementById( 'p' );
function updateProgress( newValue) {
progressBar. value = newValue;
progressBar. getElementsByTagName( 'span' )[ 0 ]. textContent = newValue;
}
</ script >
</ section > （在此示例中，updateProgress() 方法将由页面上的其他一些代码调用，以在任务进行时更新实际的进度条。）
如果存在value 和max 属性，则其值必须是有效的浮点数。如果存在value 属性，则其值必须大于或等于零，并且小于或等于max 属性的值（如果存在），否则小于或等于 1.0。如果存在max 属性，则其值必须大于零。
progress 元素不适合用于仅仅是测量仪表的用途，而不是任务进度。例如，使用progress 来指示磁盘空间使用情况是不合适的。相反，对于此类用例，可以使用meter 元素。
progress.position对于确定性进度条（具有已知当前值和最大值的进度条），返回当前值除以最大值的结果。
对于不确定性进度条，返回 -1。
meter 元素所有当前引擎都支持。
meter 元素的后代。value — 元素的当前值min — 范围的下限max — 范围的上限low — 低范围的高限high — 高范围的低限optimum — 仪表中的最佳值HTMLMeterElement。meter 元素表示已知范围内的标量测量值或分数值；例如磁盘使用情况、查询结果的相关性或投票人群中选择特定候选人的比例。
这也被称为测量仪表。
meter 元素不应用于指示进度（如进度条）。为此，HTML 提供了一个单独的progress 元素。
meter 元素也不表示任意范围的标量值——例如，如果不存在已知最大值，则使用它来报告重量或高度是不正确的。
有六个属性决定了元素表示的测量仪表的语义。
所有当前引擎都支持。
所有当前引擎都支持。
min 属性指定范围的下限，max 属性指定范围的上限。value 属性指定仪表指示为“测量”值的数值。
其他三个属性可用于将仪表的范围分成“低”、“中”和“高”部分，并指示仪表的哪个部分是“最佳”部分。 low 属性指定被认为是“低”部分的范围，而 high 属性指定被认为是“高”部分的范围。 optimum 属性给出“最佳”位置；如果该值高于“高”值，则表示值越高越好；如果它低于“低”标记，则表示值越低越好，当然，如果它介于两者之间，则表示高值和低值都不好。
value 属性必须指定。 value、min、low、high、max 和 optimum 属性在存在时，其值必须是 有效的浮点数。
此外，属性的值还受到进一步的约束。
令 value 为 value 属性的数字。
如果指定了 min 属性，则令 minimum 为该属性的值；否则，令其为零。
如果指定了 max 属性，则令 maximum 为该属性的值；否则，令其为 1.0。
以下不等式必须成立（如果适用）。
minimum ≤ value ≤ maximum
如果没有指定最小值或最大值，则假定范围为 0..1，因此值必须在此范围内。
鼓励作者在元素的内容中包含仪表状态的文本表示，以供不支持 meter 元素的用户代理的用户使用。
当与 微数据 一起使用时，meter 元素的 value 属性提供元素的机器可读值。
以下示例显示了三个仪表，它们都将充满四分之三。
Storage space usage: < meter value = 6 max = 8 > 6 blocks used (out of 8 total)</ meter > Voter turnout: < meter value = 0.75 >< img alt = "75%" src = "graph75.png" ></ meter > Tickets sold: < meter min = "0" max = "100" value = "75" ></ meter > 以下示例是不正确的元素用法，因为它没有给出范围（并且由于默认最大值为 1，因此两个仪表最终看起来都已达到最大值）。
< p > The grapefruit pie had a radius of < meter value = 12 > 12cm</ meter >
and a height of < meter value = 2 > 2cm</ meter > .</ p > <!-- BAD! --> 相反，要么不包含 meter 元素，要么使用具有已定义范围的 meter 元素，以便在与其他饼图进行比较时提供上下文中的尺寸。
< p > The grapefruit pie had a radius of 12cm and a height of
2cm.</ p >
< dl >
< dt > Radius: < dd > < meter min = 0 max = 20 value = 12 > 12cm</ meter >
< dt > Height: < dd > < meter min = 0 max = 10 value = 2 > 2cm</ meter >
</ dl > 在 meter 元素中没有明确指定单位的方法，但可以在 title 属性中以自由格式文本指定单位。
以上示例可以扩展到提及单位。
< dl >
< dt > Radius: < dd > < meter min = 0 max = 20 value = 12 title = "centimeters" > 12cm</ meter >
< dt > Height: < dd > < meter min = 0 max = 10 value = 2 title = "centimeters" > 2cm</ meter >
</ dl > 以下标记
< h3 > Suggested groups</ h3 >
< menu >
< li >< a href = "?cmd=hsg" onclick = "hideSuggestedGroups()" > Hide suggested groups</ a ></ li >
</ menu >
< ul >
< li >
< p >< a href = "/group/comp.infosystems.www.authoring.stylesheets/view" > comp.infosystems.www.authoring.stylesheets</ a > -
< a href = "/group/comp.infosystems.www.authoring.stylesheets/subscribe" > join</ a ></ p >
< p > Group description: < strong > Layout/presentation on the WWW.</ strong ></ p >
< p > < meter value = "0.5" > Moderate activity,</ meter > Usenet, 618 subscribers</ p >
</ li >
< li >
< p >< a href = "/group/netscape.public.mozilla.xpinstall/view" > netscape.public.mozilla.xpinstall</ a > -
< a href = "/group/netscape.public.mozilla.xpinstall/subscribe" > join</ a ></ p >
< p > Group description: < strong > Mozilla XPInstall discussion.</ strong ></ p >
< p > < meter value = "0.25" > Low activity,</ meter > Usenet, 22 subscribers</ p >
</ li >
< li >
< p >< a href = "/group/mozilla.dev.general/view" > mozilla.dev.general</ a > -
< a href = "/group/mozilla.dev.general/subscribe" > join</ a ></ p >
< p > < meter value = "0.25" > Low activity,</ meter > Usenet, 66 subscribers</ p >
</ li >
</ ul > 可能会呈现如下。
用户代理将 title 属性的值和其他属性结合起来，提供上下文相关的帮助或内联文本，详细说明实际值。
例如，以下代码段
< meter min = 0 max = 60 value = 23.2 title = seconds ></ meter > ……可能会导致用户代理显示一个仪表，其工具提示在一行上显示“值：23.2/60”，在第二行上显示“秒”。
以下示例显示了仪表如何回退到本地化或美化后的文本。
< p > Disk usage: < meter min = 0 value = 170261928 max = 233257824 > 170 261 928 bytes used
out of 233 257 824 bytes available</ meter ></ p > fieldset 元素所有当前引擎都支持。
legend 元素，后跟 流内容。disabled — 是否禁用后代表单控件（除 legend 内部的任何控件外）。form — 将元素与 form 元素关联。name — 用于 form.elements API 的元素名称。HTMLFieldSetElement。fieldset 元素 表示 一组组合在一起的表单控件（或其他内容），可以选择加上标题。标题由 fieldset 元素的第一个子元素 legend 元素给出（如果有）。其余的后代构成该组。
所有当前引擎都支持。
disabled 属性在指定时，会导致 fieldset 元素的所有表单控件后代（不包括 fieldset 元素的第一个子元素 legend 元素的后代）禁用。
fieldset 元素是 禁用的 fieldset，如果它满足以下任何条件。
disabled 属性已指定。fieldset 元素的后代，该元素的 disabled 属性已指定，并且不是该 fieldset 元素的第一个子元素 legend 元素的后代（如果有）。form 属性用于将 fieldset 元素显式地与其 表单所有者 关联。name 属性表示元素的名称。
fieldset.type返回字符串“fieldset”。
fieldset.elements返回元素中表单控件的 HTMLCollection。
此示例显示了 fieldset 元素用于对一组相关控件进行分组。
< fieldset >
< legend > Display</ legend >
< p >< label >< input type = radio name = c value = 0 checked > Black on White</ label >
< p >< label >< input type = radio name = c value = 1 > White on Black</ label >
< p >< label >< input type = checkbox name = g > Use grayscale</ label >
< p >< label > Enhance contrast < input type = range name = e list = contrast min = 0 max = 100 value = 0 step = 1 ></ label >
< datalist id = contrast >
< option label = Normal value = 0 >
< option label = Maximum value = 100 >
</ datalist >
</ fieldset > 以下代码段显示了一个 fieldset，其中 legend 中有一个复选框，用于控制 fieldset 是否启用。fieldset 的内容包括两个必填文本控件和一个可选的年/月控件。
< fieldset name = "clubfields" disabled >
< legend > < label >
< input type = checkbox name = club onchange = "form.clubfields.disabled = !checked" >
Use Club Card
</ label > </ legend >
< p >< label > Name on card: < input name = clubname required ></ label ></ p >
< p >< label > Card number: < input name = clubnum required pattern = "[-0-9]+" ></ label ></ p >
< p >< label > Expiry date: < input name = clubexp type = month ></ label ></ p >
</ fieldset > 您还可以嵌套 fieldset 元素。这是一个扩展前面示例的示例，它就是这样做的。
< fieldset name = "clubfields" disabled >
< legend > < label >
< input type = checkbox name = club onchange = "form.clubfields.disabled = !checked" >
Use Club Card
</ label > </ legend >
< p >< label > Name on card: < input name = clubname required ></ label ></ p >
< fieldset name = "numfields" >
< legend > < label >
< input type = radio checked name = clubtype onchange = "form.numfields.disabled = !checked" >
My card has numbers on it
</ label > </ legend >
< p >< label > Card number: < input name = clubnum required pattern = "[-0-9]+" ></ label ></ p >
</ fieldset >
< fieldset name = "letfields" disabled >
< legend > < label >
< input type = radio name = clubtype onchange = "form.letfields.disabled = !checked" >
My card has letters on it
</ label > </ legend >
< p >< label > Card code: < input name = clublet required pattern = "[A-Za-z]+" ></ label ></ p >
</ fieldset >
</ fieldset > 在此示例中，如果外部“使用俱乐部卡”复选框未选中，则外部 fieldset 内的所有内容（包括两个嵌套的 fieldset 的 legend 中的两个单选按钮）都将被禁用。但是，如果选中复选框，则两个单选按钮都将启用，并且允许您选择要启用这两个内部 fieldset 中的哪一个。
此示例显示了一组控件的分组，其中 legend 元素既标记分组，又使嵌套的标题元素在文档大纲中显示分组。
< fieldset >
< legend > < h2 >
How can we best reach you?
</ h2 > </ legend >
< p > < label >
< input type = radio checked name = contact_pref >
Phone
</ label > </ p >
< p > < label >
< input type = radio name = contact_pref >
Text
</ label > </ p >
< p > < label >
< input type = radio name = contact_pref >
Email
</ label > </ p >
</ fieldset > legend 元素所有当前引擎都支持。
fieldset 元素的 第一个子元素。HTMLLegendElement。legend 元素 表示 legend 元素的父元素 fieldset 元素其余内容的标题。
legend.form返回元素的 form 元素（如果有），否则返回 null。