课时76.兄弟选择器（掌握）

我们先来明确一点，什么是兄弟？

比如，head和body是兄弟，必须是同级关系，如果是嵌套关系，儿子，孙子则不可以。

1.相邻兄弟选择器 CSS2

作用：给指定选择器后面紧跟的那个选择器选中的标签设置属性

格式：

　　　　　　选择器1 选择器2{

　　　　　　　　　　　　属性：值;

}

我们将两个紧跟在h1之后的p标签都设置成了红色，如果我们在第一个h1标签之后添加一个a标签，则这个就没有用处来

注意点：

1.相邻兄弟选择器必须通过连接

2.相邻兄弟选择器只能选中紧跟其后的那个标签，不能选中被隔开的标签

2.通用兄弟选择器 CSS3

作用：给指定选择器后面的所有选择器选中的所有标签设置属性

格式：

选择器1~选择器2{

属性：值；

}

必须用英文符号打出来~，中文打出来打则无效

只要是在h1之后的p标签就会被设置成红色，无论它们之间有没有a标签，都并不影响

注意点：

1.通用兄弟选择器必须用~连接

2.通用兄弟选择器选中都是指定选择器后面某个选择器选中都所有标签，无论有没有被隔开都可以选中

本文转载于:猿2048➨https://www.mk2048.com/blog/blog.php?id=2kj0jcb&title=课时76.兄弟选择器（掌握）

课时76.兄弟选择器（掌握）相关推荐

html相邻兄弟选择器,CSS CSS 相邻兄弟选择器 - 闪电教程JSRUN
相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素,且二者有相同父元素. 选择相邻兄弟如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以 ...
013_CSS兄弟选择器
1.1. element1~element2选择器element1之后出现的所有element2. 1.2. 两种元素必须拥有相同的父元素, 但是element2不必直接紧随element1. 2. ...
012_CSS相邻兄弟选择器
1. 相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素, 且二者有相同父元素. 2. 选择相邻兄弟 2.1. 如果需要选择紧接在另一个元素后的元素, 而 ...
html兄弟选择器怎么用,CSS的相邻兄弟选择器用法示例讲解
对于有相同父元素的相邻HTML元素查找便可以使用CSS的相邻兄弟选择器,这里我们就来看一下CSS的相邻兄弟选择器用法简单讲解: 可选择紧接在另一个元素后的元素,且二者有相同的父级元素下面代码中,it ...
相邻兄弟选择器（+）、子选择器（）、兄弟选择器（~）等用法
前言:我们在码代码的时候,经常会遇到需要给第一个或者最后一个元素添加或删除样式,还有一些比较特殊的是选取第几个元素添加或删除样式,下面记录css选择器中常见的选择器:相邻兄弟选择器(+).子选择器(& ...
CSS3中的群组选择器,后代选择器[空格]子元素选择器＞相邻兄弟选择器+兄弟选择器~
群组选择器(',') /* 表示既h1,又h2 */ h1, h2 {color: red; } 后代选择器[空格] /* 表示 h1 下面的所有 span 元素,不管是否以 h1 为直接父元素 */ ...
课时67.标签选择器（掌握）
通过上节课的学习我们明白了如何通过十六进制来表示颜色例如:红色的几种表示方法我们发现在学习CSS当中的一些属性的时候,它都有一些套路只要知道属性的名称,属性有什么作用,它有哪些取值,这个属性有什 ...
课时71.后代选择器（掌握）
1.什么是后代选择器? 作用:找到指定标签的所有后代标签,设置属性. 首先你要明确什么是后代? 你的儿子,孙子,重孙子等,只要有你的血脉的,都是你的后代. 我们先来举个例子我们想让div中的标签变红 ...
课时77.序选择器（掌握）
CSS3中新增的选择器最具代表性的就是序选择器. 1.同级别的第几个 1. :first-child 选中同级别中的第一个标签注意点:不区分类型但是我们这里有一个注意点,如 ...

课时76.兄弟选择器（掌握）

课时76.兄弟选择器（掌握）相关推荐

最新文章

热门文章