WDI-SEA / css-selectors-animal-style

[css]

Animal Style-ing using Classes and IDs

Using what we've done in class, create HTML and CSS documents with the following directory structure:

• css_lab
  • index.html
  • styles.css

Be sure to add a link to the CSS file in the index page, and create a valid HTML document.

###Creating Elements

• make an unordered HTML list in index.html with the following animals:

  • mouse
  • canary
  • penguin
  • salmon
  • cat
  • goldfish
  • dog
  • sheep
  • parakeet
  • tuna

##Styling Elements

• make all the mammals have red text, all the birds have blue text, and all the fish have orange text using CSS classes
• apply the following colors to the list using IDs:

- mouse - gray
- canary - orangeRed
- penguin - black
- salmon - salmon
- cat - sienna
- goldfish - gold
- dog - tan
- sheep - steelBlue
- parakeet - lime
- tuna - purple

• add the following background colors to your existing classes:

- mammal - lavenderBlush
- bird - lightGray
- fish - lightYellow

• make the mammals bold

• make the birds italic

• make the fish underlined

• create a new unordered list add a list item for each the following plants:

- Dogwood Tree
- Oak Tree
- Saguaro
- Kelp
- Venus Fly Trap
- Ent

• give all ul's a border with a width of 3 pixels, a border color of plum, and a border style of dotted. Also, give them a border radius of 5px.
• give all li's a top border of 3 pixels, a color of seagreen, and a style of solid.

###Bonus

The name of this assignment is Animal Style. Set the background image for the page to a picture of In-n-Out Fries. And of course, make sure those fries are Animal style.