css的选择器-逗号、空格分隔和连写的区别

1.连写

.a.b{background-color:pink;
}

当两个元素名写在一起时，表示当前元素在html中同时出现才会出现效果，即

<div class="a b">hello</div>

2.逗号

.a,.b{background-color:pink;
}

当两个元素名用逗号分隔时，表示当前元素在html中，出现其中一个就会出现效果，它们之间属于并列关系，即

<div class="a">hello</div>
<div class="b">hello</div>

3.空格

.a .b{background-color:pink;
}

当两个元素名之间用空格分隔时，表示后代选择器，选择的是.a内的.b，只有当前的子元素才会出现效果，它们之间属于从属包含关系,即

<div class="a">hello1<div class="b">hello2</div>
</div>

补充：html中的class=“类名+空格+类名”，表示的是该元素同时拥有两个类

css的选择器-逗号、空格分隔和连写的区别相关推荐

jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)
jQuery.CSS常用选择器符号描述示例说明紧接无符号相当于"并且"关系 input.k-textbox{ ... } 选出input并且包含k-textbox ...
jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)备忘
jQuery.CSS常用选择器符号描述示例说明紧接无符号相当于"并且"关系 input.k-textbox{ ... } 选出input并且包含k-textbox ...
python 打印/输出元素，用逗号/空格分隔
如果有个列表list1=[a,b,c] 用print打印后: a b c 如果不想换行: print(list,end="") 如果想用逗号分隔: print(list,end=& ...
CSS复合选择器（后代选择器、子元素选择器、并集选择器、伪类选择器、:focus伪类选择器）
复合选择器是由两个或多个基础选择器,通过不同的方式组合而成的. 1. 后代选择器后代选择器又称为包含选择器作用:用来选择元素或元素组的子孙后代其写法就是把外层标签写在前面,内层标签写在后面,中间 ...
CSS基础——CSS复合选择器【学习笔记】
复合选择器后代选择器并集选择器 CSS选择器分为基础选择器和复合选择器 ,但是基础选择器不能满足我们实际开发中,快速高效的选择标签. 目的是为了可以选择更准确更精细的目标元素标签. 复合选择 ...
前端基础之CSS复合选择器
## 本资源由 itjc8.com 收集 --- typora-copy-images-to: media --- > 第01阶段.前端基础 # CSS 第二天今天我们围绕一个导航栏案例进行 ...
html怎么在页面中获取操作用户的id,CSS ID 选择器详解
类选择器还是 ID 选择器? 在类选择器这一章中我们曾讲解过,可以为任意多个元素指定类.前一章中类名 important 被应用到 p 和 h1 元素,而且它还可以应用到更多元素. 区别 1:只能在文 ...
css基本选择器，id选择器，class选择器，标签选择器，*通配符选择器，逗号空格 + ＞
全栈工程师开发手册 (作者:栾鹏) css系列教程1-选择器全解 css基本选择器包括id选择器,class选择器,标签选择器,*通配符选择器,以及使用逗号实现查询集合,空格实现查询后代,>实 ...
python的print函数用逗号分隔时输出不用空格_python print 按逗号或空格分隔的方法...
python print 按逗号或空格分隔的方法 1)按,分隔 a, b = 0, 1 while b < 1000: print(b, end=',') a, b = b, a+b 1,1,2 ...

css的选择器-逗号、空格分隔和连写的区别

css的选择器-逗号、空格分隔和连写的区别

1.连写

2.逗号

3.空格

css的选择器-逗号、空格分隔和连写的区别相关推荐

最新文章

热门文章