字段集和图例

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>对相当合适的容器中。