美文网首页工作生活
类选择器 ID选择器 后代选择器 子元素选择器 交集选择器 并集

类选择器 ID选择器 后代选择器 子元素选择器 交集选择器 并集

作者: nickNic | 来源:发表于2019-07-01 15:41 被阅读0次

一、类选择器
.类选器名称{css样式代码;}

二、ID选择器。

ID选择器名称{css样式代码;}

三、后代选择器。
标签名称1(.类选器名称1)(#ID选择器名称1)空格标签名称2(.类选器名称2)(#ID选择器名称2)空格标签名称3(.类选器名称3)(#ID选择器名称3){css样式代码;}

四、子元素选择器
标签名称1(.类选器名称1)(#ID选择器名称1)>标签名称2(.类选器名称2)(#ID选择器名称2)>标签名称3(.类选器名称3)(#ID选择器名称3){css样式代码;}

子元素选择器和后代选择器的不同点

后代选择器使用空格作为连接符
子元素选择器使用>作为连接符

后代选择器会选中指定标签中所有特定的后代标签也就是会选中儿子孙子重孙子...只要是放到指定标签中的特定标签都会被选中
子元素选择器只会选中指定标签中所有特定的直接标签也就是只会选中特定的儿子标签

子元素选择器和后代选择器的相同点

后代选择器和子元素选择器都可以使用标签名称ID名称类名称来作为选择器
后代选择器和子元素选择器都可以通过自己的连接符号一直延续下去

五交集选择器
给所有选择器的选中的标签中,相交的那部分设置属性
选择器1选择器2{css样式代码;}
注意点
交集选择器之间没有任何连接符号

六并集选择器
给所有选择器选中的标签设置属性
选择器1,选择器2{css样式代码;}
注意点
并集选择器之间用逗号连接

七相邻兄弟选择器
给指定选择器后面紧跟的那个选择器选中的标签设置属性
选择器1+选择器2{css样式代码;}
注意点
1相邻兄弟选择器之间用+连接
2相邻兄弟选择器只能选中紧跟其后的那个标签不能选中被隔开的标签

八通用兄弟选择器
给指定选择器后面的所有选择器选中的所有标签设置属性
选择器1~选择器2{css样式代码;}
注意点
1通用兄弟选择器之间用~连接
2通用兄弟选择器选中的是指定选择器后面某个选择器选中的所有标签,无论有没有被隔开都可以被选中.

相关文章

  • CSS选择器

    css选择器: 标签选择器 id选择器 类选择器 后代选择器 子元素选择器 交集选择器 并集选择器 兄弟选...

  • CSS

    文字相关属性 文本属性 标签选择器 id选择器 类选择器 后代择器 子元素选择器 交集选择器(了解) 并集选择器 ...

  • ## CSS选择器

    ## CSS选择器 # 标签选择器 # id选择器 # 类选择器 # 后代选择器 # 子元素选择器 # 交集选择器...

  • CSS复合选择器

    交集选择器 并集选持器 后代选择器 子元素选择器 相邻兄弟选择器 属性选择器 交集选择器 交集选择器由两个选择器直...

  • CSS的选择器

    CSS基础选择器 标签选择器 id选择器 类选择器 CSS高级选择器 后代选择器 交集选择器 并集选择器(分组选择...

  • CSS选择器、属性的三个特性、元素的显示方式、锚伪类、bpm

    目录 1.选择器 1.标签选择器、类选择器、id选择器、通配符 2.并集选择器、交集选择器、后代选择器、子代选...

  • CSS3 基本选择器

    回顾选择器 通配选择器 元素选择器 类选择器 ID选择器 后代选择器 新增基本选择器 子元素选择器(直接后代选择器...

  • CSS选择器

    选择器类型 元素选择器 类选择器 ID 选择器 属性选择器 伪类 伪元素 选择器组 后代选择器 子元素选择器 相邻...

  • react 开发实战

    CSS:选择器用法:.类名 //类选择器 id名 //id 选择器 .类名 元素名 //后代选择器,包含子元素和子...

  • 2022-02-03 CSS第二天

    emmet语法 CSS的复合选择器 后代选择器 子元素选择器 并集选择器 链接类选择器 focus伪类选择器 复合...

网友评论

    本文标题:类选择器 ID选择器 后代选择器 子元素选择器 交集选择器 并集

    本文链接:https://www.haomeiwen.com/subject/yabwcctx.html