Question

在下面的代码中，我无法理解为什么我无法看到第二个输入元素的任何内容。在第一个我使用for属性，在第二个我试图将输入元素放在标签中，如下所示： https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label

有人可以告诉我这是什么问题吗？

http://jsfiddle.net/v4Dde/102/

<input type='checkbox'  id="borderCheckBox"/>
<label for="borderCheckBox"></label>

<label class="labelClass">
<input type='checkbox' class="checkboxClass"/>
</label>

input[type=checkbox] {
   display:none;
}

input[type=checkbox] + label {
   background: black;
   height: 16px;
   width: 16px;
   display:inline-block;
   padding: 0 0 0 0px;
}

input[type=checkbox]:checked + label {
    background: red;
    height: 16px;
    width: 16px;
    display:inline-block;
    padding: 0 0 0 0px;
}

.checkboxClass + .labelClass {
   background: black;
   height: 16px;
   width: 16px;
   display:inline-block;
   padding: 0 0 0 0px;
   //border-right: 1px solid blue; 
}

.checkboxClass:checked + .labelClass {
    background: red;
    height: 16px;
    width: 16px;
    display:inline-block;
    padding: 0 0 0 0px;
}

Answer 1

这是你的

input[type=checkbox] {
   display:none;
}

尝试从none更改为block或inline等其他任何内容，具体取决于您想要的类型。

输入类型复选框，用于属性

1 个答案: