Demo: Target Selectors

Example 01: Add a CSS class to all strong elements.

Clik to highlight all strong elements …

Example 02: Add a CSS class to strong element by position.

Clik to highlight strong element: 1, 2, 3, …

<!-- EXAMPLE 01 -->

<h3>Example 01: Add a CSS class to all strong elements.</h3>

<p id="example_01_links"><a>Clik to highlight all strong elements …</a></p>
 
<div id="example_01_contents">
	<p>Revenge <strong>is</strong> a dish which is best <strong>served</strong> cold.</p>
	<p>Better to die on <strong>your</strong> feet than live on your knees.</p>
</div>

<!-- EXAMPLE 02 -->

<h3>Example 02: Add a CSS class to strong element by position.</h3>

<p id="example_02_links">Clik to highlight strong element: <a>1</a>, <a>2</a>, <a>3</a>, …</p>
 
<div id="example_02_contents">
	<p>Revenge <strong>is</strong> a dish which is best <strong>served</strong> cold.</p>
	<p>Better to die on <strong>your</strong> feet than live on your knees.</p>
</div>

/* EXAMPLE 01 */

#example_01_links a:active => #example_01_contents strong {
	style: "color: red";
}

/* EXAMPLE 02 */

#example_02_links a:active -> #example_02_contents strong {
	style: "color: red";
}