相邻兄弟选择器
相邻兄弟选择器匹配所有作为指定元素的相邻同级的元素。
兄弟(同级)元素必须具有相同的父元素,“相邻”的意思是“紧随其后”。
实例代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
div +p{
background-color:yellow;
width:400px;
}
</style>
</head>
<body>
<h1>相邻兄弟选择器</h1>
<p>相邻的同胞选择器(+)选择所有作为指定元素的相邻同级元素。</p>
<div>
<p>div 中的段落1。</p>
<p>div 中的段落2。</p>
</div>
<p>段落3,不在div中。</p>
<p>段落4,不在div中。</p>
</body>
</html>
运行效果:
评论