Photo of Professor Lawley

Professor
Lawley

Website Design
& Implementation

IGME-230 / Fall 2018

HTML Exercise
(Week 3, Tuesday 9/11)

In today's class, I'll give you a copy of a properly formatted version of the Hotel LaBonte web page, and then walk you through the CSS declarations necessary to format the page so that it closely resembles the Wikipedia version.

Due: By end of class on Thursday, 9/13.

Part 1: Retrieving the Exercise Files

Make sure that you've cloned your igme230 repository to the computer that you're currently working on. Create a new folder in that repository for this exercise. (You can call it whatever you want, but I'm going to call mine week3b.) Download the three files that you'll need for this exercise into that directory by right clicking on each of the links below and choosing "save file as...". (If you prefer, you can duplicate the files from your Tuesday exercise.)

Create a new blank css file to use for this exercise (I called mine week3b.css), and add a link tag to the html documnet referencing it.

Stage and commit these files to the repository with the commit message "Initial starting files." Sync them to GitHub, and make sure that you can see the folder and files in your igme230 repository.

Part 2: Implementing the CSS

In class, I'll walk through the various CSS rules I'm using to create this version of the page:

formatted page screenshot

At the end of class, you should commit your revised CSS file to the repository (your HTML should not need to be modified), and sync them to GitHub. Add a link from your igme230 index.html file to the exercise.