Week 05

Tuesday - Navigation Styling

When separating one HTML element (e.g., a paragraph) from another HTML element that is built using the same tag (in the example, ‹p›), we add a class attribute and a name value. So, for example, ‹p class="first"› can be styled differently from ‹p class="summary"› even though they are both paragraphs. In addition to classes, we can also style pseudo-classes. Pseudo-classes do not need to be manually coded in HTML; they are presumed to exist as extensions of specific tags. Most commonly, pseudo-classes are used to style hyperlinks. Some of this is already done by default; in your browser, when you have a hyperlink that you've never visited before it should appear in blue text with an underline; once you've visited the link it should change to purple text with an underline. That's the difference between a:link and a:visited.

We're going to leverage W3Schools' tutorial on pseudo classes to walk through the four main ones used in styling hyperlinks.