Question

是否有可能使用任何其他HTML元素作为复选框的标签。我想设置bootstrap list-group-item，其功能与我的复选框的标签相同。

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<body>

  <ul class="list-group">
    <li class="list-group-item">
      <div class="checkbox">
        <label style="width: 100%;">
                <input type="checkbox" id="cb.1.0" value="1.0">Answer
            </label>
      </div>
    </li>
  </ul>

</body>

＆＃13;

我的次优解决方法是将标签宽度设置为100％，但我想这个简单问题必须有更好的工作解决方案

Answer 1

我认为，如果不破坏语义，你唯一的选择是简化和组合一点：

<ul class="list-group">
  <li class="list-group-item">
    <label class="checkbox" style="width: 100%;">
      <input type="checkbox" id="cb.1.0" value="1.0">Answer
    </label>
  </li>
</ul>

但那是关于它的。您不能使用其他元素作为标签，使用标签而不是li不是语义。

Answer 2

您不需要在label元素中包含input元素，也可以为复选框指定id，并为标签指定属性for="checkbox-id"。然后标签可以在您想要的树中的任何位置。

使用任何其他元素作为复选框的标签

2 个答案: