css代码中的2个类名连一起写是啥意思?


<div class="menu-btn closed">
      <div class="menu-line"></div>
      <div class="menu-line"></div>
      <div class="menu-line"></div>
</div>
.menu-btn.closed .menu-line:nth-child(1){
    transform:translateY(15px) rotate(45deg);
}
.menu-btn.closed .menu-line:nth-child(2){
    opacity: 0;
}
.menu-btn.closed .menu-line:nth-child(3){
    transform:translateY(-15px) rotate(-45deg);
}

观察下面这段css的“closed”这个类名,它现在和menu-btn连在一起写,中间没写空格,意思是,如果menu-btn这个类旁边有closed这个类,那么它后面的内容就生效

比如这个时候<div class="menu-btn closed">就是生效的

如果是<div class="menu-btn">,这个时候menu-btn这个类旁边没有“closed”,那它就不生效。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM