作者:mobiledu2502878243 | 来源:互联网 | 2023-06-28 19:09
相邻兄弟选择器定义:选择紧接在另一个元素后的元素,而且两者有着相同的父元素。
代码一:
This is a heading.
This is paragraph.
This is paragraph.
This is paragraph.
This is paragraph.
This is paragraph.
使用选择器
h1 + p{
color: red;
}
效果:
这里只会选择第一个p元素,原因是只有第一个p元素与h1关系是紧接着的构成相邻兄弟,第一个p元素之后的p都不与h1紧接着。
代码二:
<body> <li>111li>
<li>111li>
<li>111li>
ul>
<ol>
<li>111li>
<li>111li>
<li>111li>
ol>
body>
使用选择器
li + li {
color: red;
}
效果:
为什么每一个li都应用了样式啊?
因为第二个li之后,每两个li之间都直接都构成了紧接着的li + li关系,所以都被选中了