Question

我正在尝试从＆＃39; codepen＆＃39;的引用创建动画菜单。但我不明白下面写的代码可以有人帮助我，这是我第一次看到像这样的代码，它看起来像选择器但不能帮助它理解 HTML：

    <div id="wrapper">
        <div class="mobile">
            <!-- Checkbox to tonggle the menu -->
            <input type="checkbox" id="tm"/>

            <ul class="sidenav">
                <li><a href="#"><i class="fa fa-apple"></i></a></li>
                <li><a href="#"><i class="fa fa-windows"></i></a></li>
                <li><a href="#"><i class="fa fa-android"></i></a></li>
                <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
                <li><a href="#"><i class="fa fa-tumblr"></i></a></li>
                <li><a href="#"><i class="fa fa-github"></i></a></li>
                <li><a href="#"><i class="fa fa-youtube-play"></i></a></li>
                <li><a href="#"><i class="fa fa-dropbox"></i></a></li>
                <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                <li><a href="#"><i class="fa fa-vimeo"></i></a></li>
                <li><a href="#"><i class="fa fa-skype"></i></a></li>
            </ul>

            <!-- Content area -->
            <section>
                <!-- Label for #tm checkbox -->
                <label for="tm">Menu</label>
            </section>

Answer 1

 #ID:checked~section{

 }

这意味着在特定ID内，如果选中复选框，则其部分（兄弟）必须具有以下属性

tilde（〜）是一般的兄弟组合

更多信息请查看 link

谁能告诉我css3中#id：checked~section {}的含义

1 个答案: