In-class #8: HTML3

This will be our final round of coding work (building upon round one and round two), at the end of which you’ll be able to assemble tables and use the <div> tag. It’s based on the skills you’ve learned in this week’s Codecademy module (Web Fundamentals: HTML Basics III).

As always, before you begin, you’ll need to have both Chrome and TextWrangler open. Below are the directions for previewing your work:

To preview in TextWrangler

• In Chrome, go to File > Open File… and open “index3.html”
• Command-Tab to select TextWrangler and write code
• Command-Tab to select Chrome and Command-R to refresh your webpage

Do the following:

1. Use/create WWW folder; create “index3.html”; add structural tags
2. Create a <title> that says “In-class assignment #8: HTML III”
3. Create a second-level heading, an intro paragraph, and another second-level heading – make the headings centered and the paragraph blue
4. Create a table with three rows and two columns (e.g., Names and birth years)
5. Create an additional row at the top of your table and fill it with column headers in bold (e.g., “Names” and “Birth Years“)
6. Make the header row bold and change the font-family style to “sans-serif”
7. Use <div> to create a 100px square of any color
8. Make the square you just created into a link
9. Add a letter inside your square. Can you remove the underline from the text?
10. Create a new div of a light color and 300px width. Write a paragraph inside. Can you make the div automatically adjust its height to fit the paragraph? (this one is easier than you might think)