/html-css

Code from Week 1

Primary LanguageCSS

Homework Instructions

DUE: Monday, January 13, 11:59PM

Assuming you:

  1. Have a free GitHub app
  2. Have installed the GitHub App for Mac or Windows
  3. Have signed into GitHub
  4. Have NOT forked this repository already

Then:

  1. Click the "Fork" button in the upper-right corner of this page. This will create a duplicate copy of this entire repository under your account.
  2. Now, your page should say "Your Name / html-css" at the top instead of "mpcs52553/html-css".
  3. Next, let's get the code down to your laptop. Click "Clone in Desktop" in the lower-right of this page. That should trigger your GitHub App to start up and sync the code down to your laptop.
  4. Modify the homework.html file so that it looks like homework_goal.png. You should duplicate everything except the actual list item text which can be different. But everything else on the page should be the same.
  5. Use your GitHub to commit your changes locally, then push the changes back to your GitHub account.

If you already forked this repository, then you can either delete your repository and re-fork, or, simply add a file named homework.html into your existing repository.

Here is the HTML guide I mentioned in class:

Practical Guide to HTML&CSS

You'll probably need the material from chapters 1 - 6 in order to complete the homework.

Grading

Your code will be judged on:

  1. Is it a valid HTML 5 document (has proper doctype, html, head, and body elements)?
  2. Do elements have proper open and closing tags?
  3. Are you using the Arial font (or another font of your choosing)?
  4. Does it look like homework_goal.png?

Hints

In order to complete the challenge, here are some HTML elements and CSS properties that might help. You don't need all of these. There are many ways to solve it, so I'm just throwing out some examples.

HTML Elements That Might Be Handy

You may or may not need these.

  • ol
  • ul
  • li
  • p
  • h1
  • h2
  • header
  • footer
  • section
  • title
  • head
  • body
  • html
  • !doctype

Some CSS Properties That Might Be Handy

  • font-family
  • border
  • background-color
  • color
  • margin
  • padding
  • list-style-type
  • display

Good luck!