<legend>:域集圖例元素

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

<legend> HTML 元素表示其父級 <fieldset> 內容的標題。

可定製的 <select> 元素中,<legend> 元素允許作為 <optgroup> 的子元素,用於提供一個易於定位和樣式的標籤。這會替換 <optgroup> 元素的 label 屬性中設定的任何文字,並且具有相同的語義。

試一試

<fieldset>
  <legend>Choose your favorite monster</legend>

  <input type="radio" id="kraken" name="monster" value="K" />
  <label for="kraken">Kraken</label><br />

  <input type="radio" id="sasquatch" name="monster" value="S" />
  <label for="sasquatch">Sasquatch</label><br />

  <input type="radio" id="mothman" name="monster" value="M" />
  <label for="mothman">Mothman</label>
</fieldset>
legend {
  background-color: black;
  color: white;
  padding: 3px 6px;
}

input {
  margin: 0.4rem;
}

屬性

此元素僅包含全域性屬性

示例

有關 <legend> 的示例,請參閱 <form>

技術摘要

內容類別 無。
允許內容 短語內容標題(h1–h6 元素)。
標籤省略 無,起始標籤和結束標籤都必須存在。
允許父級 一個 <fieldset>,其第一個子元素是這個 <legend> 元素。在 可定製的 select 元素中,<legend> 元素允許作為 <optgroup> 的子元素。
隱式 ARIA 角色 沒有對應的角色
允許的 ARIA 角色 不允許 role
DOM 介面 HTMLLegendElement

規範

規範
HTML
# the-legend-element

瀏覽器相容性

另見