我正在查看一个人在Twitter上制作的代码,就像这样:
div::after {
-webkit-transform: rotate(2deg);
}
div ~ div {
-webkit-transform: rotate(0deg);
}
是什么?
答案 0 :(得分:24)
双冒号取代了单冒号选择器 CSS3中的伪元素可以明确区分 伪类和伪元素。为了向后兼容, 对于预CSS3选择器,单冒号语法是可接受的。所以,:之后 是一个伪类,:: after是一个伪元素。
一般兄弟选择器在CSS3和组合器中可用 此选择器中使用的是波形符(〜)。
选择器匹配给定元素的兄弟元素。 如果它是h2的兄弟,这个例子将匹配一个p元素 元素:
http://reference.sitepoint.com/css/generalsiblingselector
http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/
答案 1 :(得分:21)
波形符(〜)是兄弟选择器
h2 ~ p { color:red; }
例如,会使下面代码中的段落变为红色
<h2>Heading</h2>
<p>The selector above matches this paragraph.</p>
<p>The selector above matches this paragraph.</p>
::用于::before
和::after
伪元素,它们与content:
一起允许您在每个链接之前放置一个图标
a::before { content:url(link.png); }
答案 2 :(得分:9)
{3}用于CSS3中的pseudo elements。
{3}中的::
是general sibling combinator,它用于选择跟随同一级别的其他元素的元素。