CSS/Selectors/combinators/general

From W3C Wiki
< CSS‎ | Selectors
Revision as of 20:56, 26 September 2011 by Hiroki (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

General sibling combinator A ~ B

The General sibling combinator represents a "B" element following a "A" element.


Syntax

A ~ B{ preperties }


Point, Note

  • The general sibling combinator is made of the "tilde" (~) character that separates two sequences of simple selectors.
  • The elements represented by the two sequences share the same parent in the document tree.


Example

[style.css]

 h1 ~ p{
   background-color: yellow;
 }


[index.html]

<body>
<h1>Header 1</h1>
<h2>Header 2</h2>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
</body>

Css3 selectors general.png

CSS defines the General sibling combinator in 8.3.2. General sibling combinator.