​x
 
1
<!DOCTYPE html>
2
<title>Example</title>
3
​
4
<p>Click each link to see the effect it has on the destination page:</p>
5
<ul>
6
<li><a href="/css/examples/selectors/target_pseudo-class_example.html#apples">Apples</a></li>
7
<li><a href="/css/examples/selectors/target_pseudo-class_example.html#oranges">Oranges</a></li>
8
<li><a href="/css/examples/selectors/target_pseudo-class_example.html#pears">Pears</a></li>
9
</ul>
10
​
11
<p>The source code of the destination page looks like this:</p>
12
<pre>
13
<code>
14
&lt;!DOCTYPE html&gt;
15
&lt;title&gt;Example&lt;/title&gt;
16
&lt;style&gt;
17
    :target {
18
        font-size: 5vw;
19
        color: orange;
20
    }
21
&lt;/style&gt;
22
​
23
&lt;h1 id="apples"&gt;Apples&lt;/h1&gt;
24
&lt;h1 id="oranges"&gt;Oranges&lt;/h1&gt;
25
&lt;h1 id="pears"&gt;Pears&lt;/h1&gt;
26
</code>
27
</pre>