例如:
p + p {
/* Some declarations */
}
我不知道+是什么意思。这和只为p定义一个没有+p的样式有什么区别?
例如:
p + p {
/* Some declarations */
}
我不知道+是什么意思。这和只为p定义一个没有+p的样式有什么区别?
当前回答
+显示一个相对选择器。以下是所有相对选择器的列表:
div p-选中<div>元素中的所有<p>元素。
div>p-选择直接父级为<div>的所有<p>元素。它也向后工作(p<div)
div+p-选择一个<div>元素之后立即放置的所有<p>元素。
div~p-选择前面有<div>元素的所有<p>元素。
下面是关于选择器的更多信息。
其他回答
“+”是相邻的同级选择器。它将在p之后直接选择任何p(但不是子代或父代,而是兄弟姐妹)。
+选择器以后面的一个元素为目标。类似地,~选择器以后面的所有元素为目标。如果你感到困惑,这里有一个图表:
请参见W3.org上的相邻选择器。
在这种情况下,选择器意味着样式仅适用于另一段落后面的段落。
纯p选择器会将样式应用于页面中的每个段落。
这只适用于IE7或更高版本。在IE6中,样式不会应用于任何元素。顺便说一下,这也适用于>组合子。
另请参阅Microsoft在Internet Explorer中的CSS兼容性概述。
+符号表示选择“相邻兄弟”
例如,此样式将从第二个<p>开始应用:
p+p{字号:粗体;} <div><p>第1段</p><p>第2段</p></div>
实例
看到这个JSFiddle,你就会明白:http://jsfiddle.net/7c05m7tv/(另一个JSFiddle:http://jsfiddle.net/7c05m7tv/70/)
浏览器支持
所有现代浏览器都支持相邻的同级选择器。
了解更多信息
http://css-tricks.com/almanac/selectors/a/adjacent-sibling/http://www.w3.org/TR/CSS2/selector.html#adjacent-选择器https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_selectors
+显示一个相对选择器。以下是所有相对选择器的列表:
div p-选中<div>元素中的所有<p>元素。
div>p-选择直接父级为<div>的所有<p>元素。它也向后工作(p<div)
div+p-选择一个<div>元素之后立即放置的所有<p>元素。
div~p-选择前面有<div>元素的所有<p>元素。
下面是关于选择器的更多信息。