Specifies a general sibling relationship between selector elements.
Syntax
| HTML | E ~ F { sRules } |
|---|
| Scripting | N/A |
|---|
Possible Values
| E | String that specifies the name of a document language element type or simple selector. |
| F | String that specifies the name of a document language element type or simple selector. |
| sRules | String that specifies one or more Cascading Style Sheets (CSS) attribute/value pairs. |
Remarks
The general sibling combinator is a "tilde" (~) character that separates two simple selectors. Whitespace is not significant.
A selector of the form "E~F" matches element F when it follows sibling element E in the document tree, ignoring non-element nodes (such as text nodes and comments). Element E and F must share the same parent but does not necessarily precede F directly. To match the first child of the parent, use the :first-child pseudo-class.
Note Requires Windows Internet Explorer 7 or later.
Note Attribute selectors are enabled only in standards-compliant mode (strict
!DOCTYPE).
Example
The following example applies the style rule to the first letter of each paragraph that follows an H1 but does not applies to other paragraphs preceding the H1.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
<html>
<head>
<style>
H1 ~ P:first-leter { text-decoration:underline; color: red; }
</style>
</head>
<body>
<p>This paragraph is not affected by the style rule.</p>
<h1>Header One</h1>
<h2>Header Two</h2>
<p>Paragraph text with style rule applied.</p>
<div>Other text with no style applied</div>
<p>Paragraph text with style rule applied.</p>
</body>
</html>
Standards Information
See Also