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”,那它就不生效。
css代码中的2个类名连一起写是啥意思?的更多相关文章
- grunt-css-sprite css 代码中的切片合并
安装插件:npm install grunt-css-sprite --save-dev grunt-css-sprite主要功能:1.对 css 文件进行处理,收集切片序列,生成雪碧图2.在原css ...
- gulp-css-spriter 将css代码中的切片图片合并成雪碧图
NPM地址:https://www.npmjs.com/package/gulp-css-spriter/ 配置gulpfile.js: var gulp = require('gulp'), ...
- JAVA代码中可使用中文类名,变量名,对象名,方法名.
java程序 兔子 public class 兔子{ //构造方法 public 兔子(){} public void 吃草(){ System.out.println("兔子在吃草&quo ...
- 如何写出优雅的CSS代码 ?(转)
对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于团队合作和后期的维护:而有的混 ...
- 如何写出优雅的css代码 ?
如何写出优雅的css代码 ? 对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于 ...
- 一行css代码搞定响应式布局
在这篇文章中,我将教你如何使用 CSS Grid 来创建一个超酷的图像网格图,它将根据屏幕的宽度来改变列的数量.最精彩的地方在于:所有的响应特性被添加到了一行 css 代码中.这意味着我们不必将 HT ...
- CSS代码重构与优化之路
作者:@狼狼的蓝胖子 网址:http://www.cnblogs.com/lrzw32/p/5100745.html 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多, ...
- CSS代码重构
CSS代码重构的目的 我们写CSS代码时,不仅仅只是完成页面设计的效果,还应该让CSS代码易于管理,维护.我们对CSS代码重构主要有两个目的:1.提高代码性能2.提高代码的可维护性 提高代码性能 提高 ...
- 精简CSS代码
精简CSS代码可以帮助减小样式文件的大小,使代码清晰,方便维护. 使用简写属性及默认值 .header { margin-top: 10px; margin-right: 20px; margin-b ...
- 初始化css代码需要注意的
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-05-06) 写在所有css代码之前,对网页中所有同类元素的一个样式规则代码或者一些基础性公用元素的样式规则代码. 1.空白 ...
随机推荐
- 十进制转化十六进制 && 各类进制转换问题详解
问题描述 十六进制数是在程序设计时经常要使用到的一种整数的表示方式.它有0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F共16个符号,分别表示十进制数的0至15.十六进制的计数方法是满1 ...
- 淘宝sign算法和使用教程
前言 最新写的淘宝热卖插件系列里面有涉及到淘宝sign算法加密,这里博主分享一下之前找到算法和修改后的算法以及使用教程.在此希望能帮助更多的人,欢迎各位加入我的交流Q群:468458543,群内不定时 ...
- SpringMVC请求与响应
请求 知识点1:@RequestParam 名称 @RequestParam 类型 形参注解 位置 SpringMVC控制器方法形参定义前面 作用 绑定请求参数与处理器方法形参间的关系 相关参数 re ...
- Ubuntu安装系统监视器system-monitor并显示在状态栏(火狐浏览器)
system-monitor 使用过Windows 10的朋友们都知道,Windows 10系统自带了一项功能--任务管理器,我们可以通过它方便地查看当前系统的状态,主要包括CPU,内存,硬盘,GPU ...
- Windows 11在使用AMD时,CPU占用率持续100%的解决方案
一.现象 Windows 11在使用AMD时,CPU占用率持续100%,持续好几个系统版本都是如此 二.系统版本: 版本 Windows 11 专业工作站版版本 22H2安装日期 2022/10/ ...
- 题解[CF575E]Spectator_Riots
题意 一个球场,可以看作 \(10^5\times10^5\) 的矩形,每个位置都是一个整点.一个位置 \((x,y)\) 位于球场内当且仅当 \(x\in[0,10^5]\and y\in[0,10 ...
- CentOS系统上离线部署MySQL
卸载自带Mariadb 1.[卸载前确认系统是首次安装使用,以防止误删用户数据],初次安装默认系统会自带Mariadb,卸载moriadb. 操作方式: 查找:# rpm -qa|grep maria ...
- React 使用链表遍历组件树
React 为在有限的资源情况下,更好地控制UI的更新,提出了时间分片的概念.以达到三个目标: performing non-blocking rendering(无阻塞渲染):applying up ...
- 无感刷新 Token
什么是JWT JWT是全称是JSON WEB TOKEN,是一个开放标准,用于将各方数据信息作为JSON格式进行对象传递,可以对数据进行可选的数字加密,可使用RSA或ECDSA进行公钥/私钥签名. 使 ...
- vs MFC c++ rc文件的dilog打不开,显示加载失败
最近在做一个项目,在vs2012上面用mfc画界面,由于没有确定好且不熟悉这个架构,控件类型变了又变,本人又是个有点强迫症的性格所以删掉了一些不用的控件,导致的结果就是上面说的,dialog打不开报加 ...