Week7

On the W3Schools -> HTML Tutorial read:

HTML Lists
  - Lists
  - Unordered Lists
  - Ordered Lists
  - Other Lists

On the W3Schools -> CSS Tutorial read:

CSS Lists

 


Lab7

Create a web page file named lab7.html Notice that it is all lowercase, no spaces.

Specify a DOCTYPE as the very first line in the HTML document.

Create a html file that has the correct structure using the doctype, html, head, title, and body opening and closing tags.

Title the page "Your Name lab7" where YourName is your real name.

Create the lists as shown. You may copy my example exactly or use your own text. If you use your own text, you must demonstrate at least the same list depth and number of items.

You may want to set the page body text to be Arial or sans-serif so it has a nice look.

List #1 is a three deep nested ordered list. Roman numerals for the first level, capital letters for the second level, and numbers for the third level.

You may want to copy List #1 code to start List #2 to save time as it has the same structure.

List #2 is a three deep nested unordered list using disk, circle, and square types.

List #3 is a two deep nested list using graphics as the bullets. Find or create two graphics of your choice that are appropriately sized to use as the bullets.

List #4 is a description list.

You have now created a web page.

Verify that your web page validates using the W3C online validator. You must submit a screenshot to the dropbox that the page validates without ANY errors.

Your result should be similar to what you see below.

screenshot screenshot

When validation is passed, you should see a message like below.

doc check

 

Grading Criteria Possible
Points
20
Your
Points
20
Correct file name. Correct DOCTYPE, HTML, HEAD, TITLE, and BODY structure. 1 1
List #1 created as described. 4 4
List #2 created as described. 4 4
List #3 created as described. 3 3
List #4 created as described. 3 3
Document validated without any errors. 5 5

 


Version 1.00.00