html - 如何使带有复选框的标签起作用？

Question

因为想申请所以做了个标签css到复选框。
但是，除了 ID 为“checkall”的复选框之外，该标签不起作用。

<div class="divCenter cartDiv">
            <ul>
                <li class="selectallforcart">
                    <div class="hanadiv">
                        <input type="checkbox" id="checkall" class="check" value="0"/>
                        <label for="checkall"></label> selelct All
                    </div>
                </li>
            </ul>
            <% ArrayList<LikePdVO> likeList = (ArrayList<LikePdVO>)(request.getAttribute("likeList"));
            for(LikePdVO vo : likeList) {
                String arr[] = vo.getPhoto().split("\\*");
                %>
            <div class="cartProduct" id="<%=vo.getPd_id()%>">
                <div class="fl cartCheck">
                    <input type="checkbox" class="check" name="<%=vo.getName()%>"
                    value="<%=vo.getOrder_price()%>" id="<%=vo.getPd_id()%>">
                    <label for="<%=vo.getPd_id()%>">
                    </label>
                </div>

这是我的代码。

.cartDiv input[type=checkbox] + label {
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 2px solid #bcbcbc;
        cursor: pointer;
    }
    .cartDiv input[type=checkbox]:checked + label {
        background-color: #866744;
    }
    .cartDiv input[type=checkbox] {
        display: none;
    }

这就是 CSS。

Answer 1

当你的意思是标签不起作用时，我假设你的意思是点击它不会导致复选框被选中？
无论哪种方式，标签的文本都需要在元素内，所以它应该是:

<label for="checkall">Select all</label>

并且您的其他标签不包含文本，因此尽管有 CSS，但标签本身可能很小，因此不可点击。