请参阅 W3.org 上的相邻选择器 。
在这种情况下,选择器意味着样式仅适用于直接在另一个段落之后的段落。
一个普通的p
选择器会将样式应用于页面中的每个段落。
这仅适用于 IE7 或更高版本。在 IE6 中,样式不会应用于任何元素。顺便说一下,这也适用于>
组合器。
另请参阅 Microsoft 在 Internet Explorer 中的 CSS 兼容性概述。
这是相邻的兄弟选择器。
要定义 CSS 相邻选择器,请使用加号。
h1+p {color:blue;}
上面的 CSS 代码会将任何 h1 标题之后(而不是内部)的第一段格式设置为蓝色。
h1>p
选择任何p
元件,其为直接(第一代)子(内侧) h1
元件。
h1>p
匹配<h1>
<p></p>
</h1>
( <h1>
内的<h1>
<p>
<h1>
) h1+p
将选择第一p
元素是同级(在 DOM 的相同的水平),为h1
元件。
h1+p
匹配<h1></h1>
<p><p/>
( <p>
在<h1>
旁边 / 之后) +
号表示选择 “相邻的兄弟”
例如,此样式将从第二个<p>
:
p + p {
font-weight: bold;
}
<div>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</div>
看到这个 JSFiddle,您将理解它: http : //jsfiddle.net/7c05m7tv/ (另一个 JSFiddle: http : //jsfiddle.net/7c05m7tv/70/ )
所有现代浏览器均支持相邻的兄弟选择器。