www.wd4e.com

Final Project

This homework is also described in a video lecture. Make sure to watch it to get a better feel for what I am looking for.


Objectives

    Create a style sheet and link it to the html files. (Without changing the html.)
    Style the sheet using the properties we covered in lecture. There is a particular emphasis on pseudo-elements and pseudo-classes. There is an opportunity to use some properties we didn’t cover in class. For instance, we want to style on the first element of each row to be left-aligned. The rest should be centered.

Background

I assume that you have finished all of the Week Three lecture videos, and you may want to watch Week Four as you complete this assignment. This assignment builds on Assignments One and Two. Our final step is to style the table on the teams page. Here is a link to the teams page after the final project.

http://www.intro-webdesign.com/CSS/final/teams.jpg


Getting Started

You will use the same code as you used for Assignment Two. I would recommend that you save copy of your style sheet for backup. The html is all still the same.


Steps

    Style the following
  • The table should be styled using at least four properties
  • The table headings should have a thicker bottom border with the top two corners rounded, a background color, and at least one other property
  • Style the table so that the text in the first column is left-aligned and the text in the other two columns is centered
  • Set the opacity of the table rows to a value between .6 and .8 (make sure it is still visible)
  • Change the opacity of a row when it is hovered over
  • The table elements td should be styled using at least four properties

    • I have included a video you can watch to see a live demo of this new site. You can watch it in the next video, or link directly here: https://www.coursera.org/learn/introcss/lecture/SyQ0X/04-06-optional-homework-description


    Submission

    1. Submit your css file, we will still call it hw1.css.
    2. Use the peer grader to assess the work of your fellow students. This second assignment may have a number of different options. You can grade the assignment by eye, or else save the css and try applying it to the html files.