字段集和圖例

Question

好的，我知道fieldset/legend在HTML中是如何工作的。假設你有一個表格的某些字段：

<form> 
    <fieldset> 
     <legend>legend</legend> 
     <input name="input1" /> 
    </fieldset> 
</form> 

我應該怎麼使用legend呢？它被顯示爲標題，但不是傳說中的語義上的內容解釋？在我看來，最好你會這樣做：

<form> 
    <fieldset> 
     <legend>* = required</legend> 
     <label for="input1">input 1 *</label><input id="input1" name="input1" /> 
    </fieldset> 
</form> 

但是，這並沒有真正解決如何字段集呈現。這僅僅是HTML中的一個有意義的命名，還是我對英文單詞'legend'的誤解？

---

編輯：修正了一些錯誤;-)

Answer 1

是，命名是模糊的。最好將它視爲fieldset的標題。

見the HTML spec on FIELDSET and LEGEND elements如果您尚未：

的LEGEND元素允許作者指定一個標題爲FIELDSET。該圖例改善了非可視化渲染FIELDSET時的可訪問性。

Answer 2

我猜你的意思是寫

<form> 
    <fieldset> 
     <legend>legend</legend> 
     <input name="input1" /> 
    </fieldset> 
</form> 

但部分是正確的。字樣有幾個含義，包括

• 一個說明性標題伴隨着 的說明。
• 解釋性 表或地圖或圖表上出現的符號 的列表。

所以它實際上可以同時代表兩者。

Answer 3

當你說圖例「它被顯示爲標題」..顯然它取決於涉及的CSS。當你自己沒有指定CSS時，每個瀏覽器都使用自己的內置樣式，這可能是也可能不是最好的。

我同意傳說與標題不同......我不一定認爲傳說是像「* = required」這樣的東西的正確位置（這似乎只是用戶的一條警示信息片段，而不是對場景本身的解釋）。畢竟，一個圖例可以被定義爲一個標題，或者是一個簡單的描述（通常是一種除了這種情況下的圖像之外的東西）。至於它如何顯示，CSS再次讓你看到（或不是）你看到的合適的權力。

Answer 4

將圖例視爲組框的標題。您可以使用它將類似的表單元素分組在一起。您可以在一個字段集中具有「送貨地址」圖例的送貨地址的所有輸入字段，以及具有「送貨地址」圖例的另一字段集中的賬單地址的所有輸入字段集。

下面是一個例子：

Fieldsets in Skiviez Checkout http://piasecki.name/fieldset-legend-example.jpg

他們可以通過CSS是棘手的風格（因爲Internet Explorer顯示的字段集不正確的背景Our IE stylesheet有一些很好的例子，看看在「＃內容形式。字段集」部分。

Answer 5

的<legend>元件是的語義等效‘標題’或‘標題’用於由<fieldset>包含在組表單控件。

的FIELDSET元件允許作者組主題相關的控制

這意味着fieldset S的關係組一起幾個表單控件 - 不只是一個單一的對<input>和<legend>。

事實上<div> S，<p> S或<li> s爲用於<input> + <legend>對相當合適的容器中。