CSS for sel1-5

  <script>
    a:link  { background-color: white; color: blue; font-style: underline; }  # 0,0,1,1
     a:hover  { background-color: #97fc00; color: blue; font-style: underline; }  # 0,0,1,1
     a:active  { background-color: red; color: blue; font-style: underline; }  # 0,0,1,1
     a:visited  { background-color: white; color: purple; font-style: underline; }  # 0,0,1,1
  </script>
  

Page Content

<h3>Pseudo selectors - all relating to links</h3>
<p>Here the :visited selector wins all ties.  As a result,
once a link has been visited, neither :hover nor :active work.</p>
<ul>
 <li><a id="#5">Target #5</a><a href="#1">Link One</a></li>
 <li><a id="#1">Target #1</a><a href="#2">Link Two</a></li>
 <li><a id="#2">Target #2</a><a href="#3">Link Three</a></li>
 <li><a id="#3">Target #3</a><a href="#4">Link Four</a></li>
 <li><a id="#4">Target #4</a><a href="sel1-6.html">Link Five - next page</a></li>
</ul>
  

Pseudo selectors - all relating to links

Here the :visited selector wins all ties. As a result, once a link has been visited, neither :hover nor :active work.