<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
p{
height: 30px;
background-color: red;
}
/* + 当前元素的下一个 /
.item1+p{
background-color: aqua;
}
/当前之后的所有p元素的样式*/
.item3~p{
background-color: blue;
}
</style>
</head>
<body>
<div id="box">
<p class="item1"></p>
<p class="item2"></p>
<p class="item3"></p>
<p class="item4"></p>
<p class="item5"></p>
</div>
</body>
</html>
子元素选择器 +兄弟选择器 ~通用兄弟节点选择器p~b [ ]通用选择器 [id]附带id属性的 div[ id]...
子元素选择器+兄弟选择器通用兄弟节点选择器pb[ ]通用选择器[id]附带id属性的div[ id]div中具有[...
效果图： 方法一：通用兄弟选择器（ ~ ） li~li {...} 中的 ~ 符号称为通用兄弟选择器，匹配P元素之...
基本选择器 通配符选择器 元素选择器 类选择器 ID选择器 后代选择器 子元素选择器 相邻兄弟选择器 通用兄弟选择...
1.基本选择器 1.1子元素选择器（直接后代选择器） 1.2 相邻兄弟元素选择器 1.3 通用兄弟选择器 1.4群...
兄弟选择器 通用兄弟选择器h1~p 相邻选择器包含两个条件：拥有相同父元素；某元素的下一个元素h1+p 父子选择器...
Title p{height: 30px;background-color...
1、作用: 给指定选择器后面的所有选择器选中的所有标签设置属性2、连接符：~3、格式： 4、注意点:通用兄弟选择器...
1.选择器类型 选择器：让你找到页面上的对应元素 1）基础选择器 通用选择器*通用选择器加边框PS： * 通用选择...
本文标题：通用兄弟选择器 + ~
本文链接：https://www.haomeiwen.com/subject/obxhyttx.html
网友评论