Question

我在修改属于特定输入的标签时遇到问题。在选中相应的输入 - 复选框时修改后面的div可以正常工作。但是如果我尝试使用smae方法来标记它就会失败。另外，如果我在标签周围放置一个额外的div并尝试访问它而不是标签（在检查适当的输入时），它也无法做任何事情。

我的问题主要是我在那里做错了什么？

HTML

<input type="radio" id="TabOne" class="sheet-TabOne" name="Tab" checked="checked" />
<input type="radio" id="TabTwo" class="sheet-TabTwo" name="Tab" />

<div class="sheet-TabHeader">
    <label for="TabOne" class="sheet-TabOne">One</label>
    <label for="TabTwo" class="sheet-TabTwo">Two</label>
</div>


<div class="sheet-TabContent sheet-TabOne">
    First content
</div>

<div class="sheet-TabContent sheet-TabTwo">
    Second content
</div>

CSS：

label.sheet-TabHeader {
    float: left;
    width: auto;
    border: 2px solid #A52A2A;
    width: 150px;
    height: 20px;
    font-size: 18px;
    background: #fff;
    color: black;    
}

input.sheet-TabOne:checked ~ label.sheet-TabOne, 
input.sheet-TabTwo:checked ~ label.sheet-TabTwo
{
    background: black;
    color: red
    text-shadow: 0px 0px 5px black,0px 0px 5px black,0px 0px 5px black;
}

div.sheet-TabContent {
    display: none;   
    clear: left;
}

input.sheet-TabOne,
input.sheet-TabTwo
{
    display: none;   
}

input.sheet-TabOne:checked ~ div.sheet-TabOne, 
input.sheet-TabTwo:checked ~ div.sheet-TabTwo
{
    display: block;   
}

Answer 1

AFAIU，标签标签仅用于输入标签。您不能将它与div标签一起使用。它通过输入id链接。您尝试将它们链接到没有任何ID的div。

检查输入时修改标签样式失败

1 个答案: