Question

How does one style links for the current page differently from others? I would like to swap the colors of the text and background.

li a {
  color: #A60500;
}

li a:hover {
  color: #640200;
  background-color: #000000;
}

<ul id="navigation">
  <li class="a"><a href="/">Home</a></li>
  <li class="b"><a href="theatre.php">Theatre</a></li>
  <li class="c"><a href="programming.php">Programming</a></li>
</ul>

Answer 1

a:active : when you click on the link and hold it (active!).
a:visited : when the link has already been visited.

If you want the link corresponding to the current page to be highlighted, you can define some specific style to the link –

.currentLink {
   color: #640200;
   background-color: #000000;
}

Add this new class only to the corresponding li (link), either on server-side or on client-side (using JavaScript).