<style type="text/css">
h1 + p {
margin-top:50px;
color:red;
}
</style>
<p>This is paragraph.</p>
<h1>This is a heading.</h1>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
+ 加选择器
如果要选择紧接在一个元素后的另一个元素,而且二者有相同的父元素。可以使用相邻兄弟选择器。
这里面的 + 只会影响下一个p标签的样式,不会影响上一个 p 标签的样式。
~选择器
目的是查找某一个元素后的所有节点
<style type="text/css">
h1 ~ p{
color:red;
}
</style>
<p>1</p>
<h1>2</h1>
<p>3</p>
<p>4</p>
<p>5</p>