相关疑难解决方法(0)

我正在尝试做的是在选中标签+复选框时显示并隐藏div.(仅限CSS)

因此,如果单击[签名](选中).隐藏自己(div.remove-check)并显示隐藏的输入(div #mail).我认为我的代码会很好,但事实并非如此.我究竟做错了什么？

我的代码:

HTML:

<div class="remove-check">
    <label for="reveal-email" class="btn" style="width: 300px"><input type="checkbox" id="reveal-email" role="button" />Sign Up</label>
</div>
<br>
<div id="email">
    <form id="email-form" class="nice" action="" method="post">
        <input class="input-text required email" type="text" name="EMAIL" id="id_email" placeholder="Email" />
        <input type="hidden" name="name" id="id_name_email">
        <a class="btn" >Apply</a>
    </form>
</div>

CSS:

input[type=checkbox]{
    visibility: hidden;
}
input[type=checkbox]:checked ~ .remove-check{
    display: none;
}
input[type=checkbox]:checked ~ #email{
    display: block;
}
#email{
    display: none;
}

这是一个小提示,向您展示我正在与之合作.

提前谢谢你的帮助.