• 中间有空格的情况

    是选择到.class1类下的.class2类子节点,即.class2类的节点要是.class1类子节点
 <style>
.class1 {
color: black;
}
.class1 .class2 {
color: red;
}
</style>
<body>
<div class="class1">
I'm class1
<div class="class2">I'm class2,son of class1</div>
</div>
</body>

结果:

  • 中间无空格情况

    是选择到同时拥有.class1和.class2的节点
 <style>
.class1 { color: black; }
.class1 .class2 { color: red; }
.class1.class2 { color: blue; }
/*注意优先级,.class1 .class2的优先级比.class1.class2高,.class1 .class2写在.class1.class2后,.class1.class2会被覆盖*/
</style>
<body>
<div class="class1">
I'm class1
<div class="class2">I'm class2,son of class1</div>
<div class="class1 class2">I'm class1class2,son of class1</div>
</div>
</body>

结果:

css定位,class属性之间有空格与无空格的区别的更多相关文章

  1. css定位position属性深究

    1.static:对象遵循常规流.此时4个定位偏移属性不会被应用. 2.relative:对象遵循常规流,并且参照自身在常规流中的位置通过top,right,bottom,left这4个定位偏移属性进 ...

  2. CSS定位的属性值

    关于CSS定位都是老生常谈的问题了,不过有一个问题,最新的属性值在某些网站上并没有被更新到教程上 下面我记录一下 position现在有五个属性值 1.static:静态定位,没有特殊的定位规则,遵循 ...

  3. CSS选择器:#id和.class中间有空格和无空格的区别

    相信大家都知道 .class1 .class2 和 .class1.class2 是两种不同的选择规则,但具体怎样不同呢? 首先中间有空格的情况:是选择到.class1类下的.class2类子节点,即 ...

  4. CSS 定位相关属性 :position

    我们平时经常用margin来进行布局,但是遇到一些盒子不规律布局时,用margin就有点麻烦了,这个时候我们可以用position. position:参数 参数分析: 一.absolute: 相对父 ...

  5. HTML5学习笔记(八):CSS定位

    CSS 定位 (Positioning) 属性允许你对元素进行定位. 定位和浮动 CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠.定位的基本思想很简单 ...

  6. CSS 定位 (Positioning)

    CSS 定位 (Positioning) 属性允许你对元素进行定位. CSS 定位和浮动 CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠,还可以完成多 ...

  7. CSS定位属性position相关介绍

    position属性用来定义元素的定位方式. 定位相关属性值 1.static 默认值 2.absolute 绝对定位 3.fixed 固定定位 4.relative 相对定位 5.sticky 粘性 ...

  8. CSS学习笔记——定位position属性的学习

    今天学习之前剩下的一个问题:CSS的position属性.首先归纳出和position相关的问题: position作为一个属性,它一共有哪几个属性值? position常用的属性值有哪几个?分别有什 ...

  9. CSS定位属性Position详解

    CSS中最常用的布局类属性,一个是Float(CSS浮动属性Float详解),另一个就是CSS定位属性Position. 1. position:static 所有元素的默认定位都是:position ...

随机推荐

  1. DVWA-全等级命令行注入

    DVWA简介 DVWA(Damn Vulnerable Web Application)是一个用来进行安全脆弱性鉴定的PHP/MySQL Web应用,旨在为安全专业人员测试自己的专业技能和工具提供合法 ...

  2. 使用Java8改造出来的模板方法真的是yyds

    GitHub 21.3k Star 的Java工程师成神之路,不来了解一下吗! GitHub 21.3k Star 的Java工程师成神之路,真的不来了解一下吗! 我们在日常开发中,经常会遇到类似的场 ...

  3. prism 中的 自定义region

    参考网址: https://blog.csdn.net/weixin_30872499/article/details/98673059 并不是所有控件都可以被用作Region了吗?我们将Gird块的 ...

  4. 【java web】过滤器、拦截器、监听器的区别

    一.对比: 1.1 过滤器和拦截器的区别: ①拦截器是基于java的反射机制的,而过滤器是基于函数回调. ②拦截器不依赖与servlet容器,过滤器依赖与servlet容器. ③拦截器只能对actio ...

  5. Java规范化代码eclipse模板注释

    建议下载阿里规范化插件 阿里的new java file的注释模板(Type): /**  * @author ${user}  * @date ${currentDate:date('YYYY/MM ...

  6. 关于MYSQL5.7:Access denied for user 'root'@'localhost' (using password:YES)解决

    这一类解决要提供远程服务,需要进入mysql的my.ini文件中进行修改,但是在win10系统中,my.ini不再放在MYSQL安装目录的根目录中了,需要到一类应用缓存目录中寻找MYSQL的详细配置文 ...

  7. redux的使用

    1.redux的使用 核心概念 action 动作的对象 包含2个属性 type:标识属性, 值为字符串, 唯一, 必要属性 data:数据属性, 值类型任意, 可选属性 例子:{ type: 'AD ...

  8. K8s配置。--未完成

    配置K8s ##################################################################################### # 配置 --- ...

  9. Appium问题解决方案(8)- selenium.common.exceptions.WebDriverException: Message: An unknown server-side error occurred while processing the command. Original error: Could not sign with default certificate.

    背景 运行时代码报错: selenium.common.exceptions.WebDriverException: Message: An unknown server-side error occ ...

  10. java代码覆盖实战

    Jacoco原理 代码插桩 On-the-fly插桩: JVM中通过-javaagent参数指定特定的jar文件启动Instrumentation的代理程序,代理程序在通过Class Loader装载 ...