67

我正在使用 Bootstrap，它是水平形式的演示：

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label for="inputEmail1" class="col-lg-2 control-label">Email</label>
    <div class="col-lg-10">
      <input type="email" class="form-control" id="inputEmail1">
    </div>
  </div>
</form>

但我不想为每个人创建 ID <input>，所以

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label class="block">
      <span class="col-lg-2 control-label">Email</span>
      <div class="col-lg-10">
        <input type="email" class="form-control">
      </div>
    </label>
  </div>
</form>

但display:block不能在里面display:inline，所以我使用 CSS

.block {
  display: block;
}

它正在工作，但它正确吗？因为我听说我们不应该将display:block元素放入display:inline元素（label）

4

1 回答 1

84

不，HTML 不允许 a<label>包含<div>.

请参阅标签元素的规范：

内容模型：短语内容，但没有后代可标记元素，除非它是元素的标记控件，并且没有后代标签元素。

措辞内容链接到：

短语内容是文档的文本，以及在段落内级别标记该文本的元素。短语内容形成段落。

a abbr area（如果它是地图元素的后代）audio b bdi bdo br button canvas cite code data datalist del dfn em embed i iframe img input ins kbd keygen label map mark math meter noscript object output progress q ruby s samp script select small span strong sub sup svg textarea time u var video wbr text

于 2013-09-04T09:07:23.360 回答