From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../web/css/general_sibling_combinator/index.html | 73 ++++++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 files/zh-cn/web/css/general_sibling_combinator/index.html (limited to 'files/zh-cn/web/css/general_sibling_combinator') diff --git a/files/zh-cn/web/css/general_sibling_combinator/index.html b/files/zh-cn/web/css/general_sibling_combinator/index.html new file mode 100644 index 0000000000..941e9c9218 --- /dev/null +++ b/files/zh-cn/web/css/general_sibling_combinator/index.html @@ -0,0 +1,73 @@ +--- +title: 通用兄弟选择器 +slug: Web/CSS/General_sibling_combinator +tags: + - CSS + - Selectors +translation_of: Web/CSS/General_sibling_combinator +--- +
{{CSSRef}}
+ +

概述

+ +

兄弟选择符,位置无须紧邻,只须同层级,A~B 选择A元素之后所有同层级B元素。

+ +

语法

+ +
former_element ~ target_element { style properties }
+ +

示例

+ +
p ~ span {
+  color: red;
+}
+ +

上面的CSS作用于下面的HTML中:

+ +
<span>This is not red.</span>
+<p>Here is a paragraph.</p>
+<code>Here is some code.</code>
+<span>And here is a span.</span>
+ +

则会产生下面的效果:

+ +

This is not red.

+ +

Here is a paragraph.

+ +

Here is some code.And here is a span.

+ +

规范

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
CSS Selectors Level 3{{Spec2('CSS3 Selectors')}}
+ +

浏览器兼容性

+ +

{{Compat("css.selectors.general_sibling")}}

+ +
+ +

相关

+ + + +
+
+
-- cgit v1.2.3-54-g00ecf