<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”,那它就不生效。

css代码中的2个类名连一起写是啥意思?的更多相关文章

  1. grunt-css-sprite css 代码中的切片合并

    安装插件:npm install grunt-css-sprite --save-dev grunt-css-sprite主要功能:1.对 css 文件进行处理,收集切片序列,生成雪碧图2.在原css ...

  2. gulp-css-spriter 将css代码中的切片图片合并成雪碧图

    NPM地址:https://www.npmjs.com/package/gulp-css-spriter/ 配置gulpfile.js: var gulp = require('gulp'),     ...

  3. JAVA代码中可使用中文类名,变量名,对象名,方法名.

    java程序 兔子 public class 兔子{ //构造方法 public 兔子(){} public void 吃草(){ System.out.println("兔子在吃草&quo ...

  4. 如何写出优雅的CSS代码 ?(转)

    对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于团队合作和后期的维护:而有的混 ...

  5. 如何写出优雅的css代码 ?

    如何写出优雅的css代码 ? 对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于 ...

  6. 一行css代码搞定响应式布局

    在这篇文章中,我将教你如何使用 CSS Grid 来创建一个超酷的图像网格图,它将根据屏幕的宽度来改变列的数量.最精彩的地方在于:所有的响应特性被添加到了一行 css 代码中.这意味着我们不必将 HT ...

  7. CSS代码重构与优化之路

    作者:@狼狼的蓝胖子 网址:http://www.cnblogs.com/lrzw32/p/5100745.html 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多, ...

  8. CSS代码重构

    CSS代码重构的目的 我们写CSS代码时,不仅仅只是完成页面设计的效果,还应该让CSS代码易于管理,维护.我们对CSS代码重构主要有两个目的:1.提高代码性能2.提高代码的可维护性 提高代码性能 提高 ...

  9. 精简CSS代码

    精简CSS代码可以帮助减小样式文件的大小,使代码清晰,方便维护. 使用简写属性及默认值 .header { margin-top: 10px; margin-right: 20px; margin-b ...

  10. 初始化css代码需要注意的

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-05-06) 写在所有css代码之前,对网页中所有同类元素的一个样式规则代码或者一些基础性公用元素的样式规则代码. 1.空白 ...

随机推荐

  1. C# DevExpress GridControl中BandedGridView表格使用

    1.设计器方式创建 1.点击"Change view">>然后在选中"Convert to"选项>>最后选中点击"Banded ...

  2. SFTP实现密钥登陆并上传文件

    什么是SFTP,公开键认证,SFTP可不是FTP协议的扩展,他是基于SSH的文件传输协议. 而当SFTP服务器登录有客户端的公开键时,客户端就可以用自己的私有键去跟服务器握手(handshake)已实 ...

  3. Windows 下安装 Bun:像 Node 或 Deno 一样的现代 JavaScript 运行时

    背景 最近前端工具链又火了一个项目 Bun,可以说内卷非常严重.Bun 是一个新的 JavaScript 运行时,内置了打包器.转译器.任务运行器和 npm 客户端. Bun 是像 Node 或 De ...

  4. Installing Superset最新版本安装(笔记)

    官方文档:https://superset.apache.org/docs/installation/installing-superset-from-scratch 由于在centos上安装有各种问 ...

  5. Voletile-多线程小例子

    public class Test{ public static volatile int t = 0; //如果没有下面的全局锁标识,则结果不一定为10*1000 public static Str ...

  6. 2022-05-11内部群每日三题-清辉PMP

    1.一个低概率/高影响的技术风险发生了. 项目经理该怎么做? A. 提交变更请求来调整成本和进度基准 B. 进行风险审查,评估其对项目可交付成果的影响 C. 实施风险登记册中概述的减轻计划 D. 查询 ...

  7. laravel 服务容器,容器概念

    Laravel 服务容器 发现一篇讲服务容器的文章,讲的很好,转载过来laravel 服务容器 实质是工厂模式的升级,类的传递动态加载 ####以下内容转载 容器,字面上理解就是装东西的东西.常见的变 ...

  8. MobaXterm汉化版教程

    MobaXterm中文版是一款非常好用的远程连接.远程控制软件,它堪称全能终端神器,支持非常多的远程协议 ,如SSH,Telnet,Rsh,Xdmc,RDP,VNC,FTP,SFTP,串口(Seria ...

  9. MATH1851 Trigonometric Formula Notes

    大学里老师都默认我们学过 正割 \(\sec\),余割 \(\csc\) 与余切 \(\cot\) 再加上高中的一些公式都有点遗忘,开个贴做个笔记 常规的 \(\sin x, \cos x, \tan ...

  10. 为win10添加右键“以管理员身份运行MSI”选项

    win+r运行regedit以打开注册表编辑器 定位到HKEY_CLASSES_ROOT\Msi.Package\shell 右键shell,新建 项 项名称为runas 双击runas右边的默认,填 ...