<figure class="code" id="figure5">
    <pre class=" language-css"><code class=" language-css"><span class="token selector">a:hover, a:active, a:focus </span><span class="token punctuation">{</span> <span class="token property">outline</span><span class="token punctuation">:</span> 2px solid blue <span class="token punctuation">}</span></code></pre>
    <figcaption><b>Figure 5.6</b>: Use CSS to provide a visible outline around items that have keyboard focus. In this example, the same 2 pixel blue outline identifies which item is moused over (hover), active, or has keyboard focus.</figcaption>
</figure>
Add pattern for figure with a code
Add pattern for figure with a code
