2

我们正在讨论，因为我目前正在修复一个 IE7 错误，因为<label>标签<input>被包裹在一个<p>.

我似乎找不到标签中包含的<form>标签的正确语义的任何文档。例如，我倾向于使用以下内容，

<form action="" method="post">
  <fieldset>
    <div class="formrow">
      <label for="firstname">Firstname:</label>
      <input type="text" id="firstname" name="firstname" />
    </div>
  </fieldset>
</form>

然而，看看Zurb 基金会，他们根本不包装任何元素，也许是为了风格，但radio他们checkbox把我认为无效的东西放在<input>里面。<label>虽然 Zurb 页面正在使用HTML5，所以它可能在那里有效？

Twitter Bootstrap倾向于采用类似于我的双重包装方法<div>。但同样，它们也将radioandcheckbox输入包含在标签内。

<form>那么，对于我的问题，标签内元素的语义是否有明确的规则？

4

3 回答 3

1

如果您想知道哪些元素可以成为表单元素的后代，我建议您查看HTML4 规范的表单部分（或查看等效的HTML5 部分）。

例如，任何内联元素都可以在<label>. ：

<!ELEMENT LABEL - - (%inline;)* -(LABEL) -- form field label text -->

input元素在其元素内的原因label是单击描述性文本也会切换复选框的状态。Afaik 您可以通过for正确设置属性来实现相同的目的。

于 2011-12-14T15:05:17.200 回答
0

您应该按照此处所述使用它：http: //www.w3schools.com/html5/tag_fieldset.asp 一个示例：http ://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_fieldset

或者，您可以将输入字段的“描述”包装成

<label>

元素。

<label for="name_of_inputfield">Name:</label>

请注意，使用

<legend>

如果您使用的是标签

<fieldset>
于 2011-12-14T15:06:11.223 回答
0

示例标记在 XHTML 1.0 中无效，因为 fieldset 元素不包含所需的图例元素。在 HTML5 中，它是正确的，但是不允许使用 action="" 属性（action 属性值不能为空）。

但实际上，字段集标记毫无意义——该元素可用于对字段进行分组，但示例不包含组外的字段。尽管 XHTML 1.0 Strict 规则要求 div 标记也是多余的。但可能真正的形式是不同的。如果您有多个“行”，正如类名“formrow”所暗示的那样，那么表格元素很可能是最佳标记。

将字段及其标签包装在容器元素中的三个原因：满足 HTML 4.01 Strict 和 XHTML 1.0 Strict 规则（要求表单中的任何内容都包装在块级容器中），使样式化成为可能它们作为一个整体，并且更容易将它们视为客户端脚本中的一个单元。对于这样的包装，

  • div 是语义上的空元素，通常很方便
  • fieldset 可能是合乎逻辑的，但根据旧规则需要图例，并且默认情况下会创建一种特殊的边框
  • p 在 HTML5 规则下是可以的（它自由地解释了段落的概念），但与 div 相比，它几乎没有什么优势——相反，它可能意味着默认的顶部和底部边距太大。
于 2011-12-14T18:28:09.340 回答