Link Styling

Lord Vader Hates Furry Animals

Link Styling

  • Read pages 290 - 291 (HTML & CSS Design and Build Websites)

Activity

Here you can test out what you read, and achieve badges.

Activity Instructions

Read the content at the top of this page before completing this activity.

The goal of this activity is to style two sets of links in different ways. The finished image will not show you all of the styles since these need to be interacted with. Follow the instructions on what to style.

  1. Do not edit the HTML
  2. A couple of the CSS rules are provided for you

Generic Links

  1. Make all generic links brown
  2. Make all generic visited links orange
  3. Make all generic active links black
  4. Make all generic hover links blue

Header Links

  1. Make all header links, and header visited links red
  2. Make all header hover links white, with a black background
  3. Make all header active links yellow

HTML

CSS

JavaScript

Output