html - can someone tell me the meaning of #id:checked~section{} in css3 -
I'm trying to create animated menus in the context of 'codepen', but I do not understand the code written below Coming out to me, for the first time I saw the code like this, it looks like a selector, but it helps to understand the HTML:
& Lt; Ul class = "sidenav" & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-apple" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-fa-window" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-android" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-tarbible" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "FA FA-tumbler" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-gitub" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-youtube-play" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-drop-dropbox" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-twitter" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa efeimio" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; I class = "fa-fi-skype" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt ;! - Content area - & gt; & Lt; Section & gt; & Lt ;! - Label for #tm checkbox - & gt; & Lt; Label = "tm" & gt; Menu & lt; / Label & gt; & Lt; / Section & gt;
# id: checked ~ section {}
This means that the check box is checked if the check box is checked, then its section (s) should have the following properties
Tilde (~) is a common brother coordinator
Check this
Comments
Post a Comment