5

好吧，我知道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'的误解？

编辑：修复了一些错误；-)

4

5 回答 5

8

是的，命名是模棱两可的。最好将其视为字段集的标题。

如果您还没有，请参阅HTML 规范FIELDSET和LEGEND元素：

该LEGEND元素允许作者将标题分配给FIELDSET. FIELDSET当以非可视方式呈现时，图例可提高可访问性。

于 2008-10-31T13:15:33.553 回答
1

我猜你是想写

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

但你有一部分是对的。传说这个词有几个含义，包括

  • 附有插图的说明性标题。
  • 出现在地图或图表上的符号说明表或列表。

所以它实际上可以同时表示两者。

于 2008-10-31T13:17:35.763 回答
1

当您说图例“它被显示为标题”时......显然它取决于所涉及的 CSS。当您自己不指定 CSS 时，每个浏览器都会使用自己的内置样式，这可能是最好的，也可能不是。

我同意图例与标题不同......我不一定认为图例是“* = 必需”之类的正确位置（这似乎只是用户的警示信息，而不是真正的字段集本身的解释）。

毕竟，图例可以定义为标题，或附有插图的简要说明（通常；在这种情况下，不是图像）。

至于它是如何显示的，CSS 让你有能力让它出现（或不显示）你认为合适的。

于 2008-10-31T13:19:08.380 回答
1

将图例视为组框的标题。您可以使用它将相似的表单元素组合在一起。您可以将送货地址的所有输入字段放在一个带有“送货地址”图例的字段集中，并将帐单地址的所有输入字段的集合放在另一个带有“帐单地址”图例的字段集中。

这是一个例子：

Skiviez Checkout 中的字段集 http://piasecki.name/fieldset-legend-example.jpg

通过 CSS 设置它们的样式可能很棘手（因为 Internet Explorer 不正确地显示字段集的背景。我们的 IE 样式表有一些很好的示例；请查看“#content form fieldset”部分。

于 2008-10-31T13:20:38.613 回答
1

该<legend> 元素是由<fieldset>.

FIELDSET 元素允许作者对与主题相关的控件进行分组

这意味着fieldsets 应该将多个表单控件组合在一起——而不仅仅是一对<input>and <legend>。

事实上<div>s、<p>s 或<li>s 是非常适合<input>+<legend>对的容器。

于 2008-10-31T13:27:23.667 回答