Unit 3 Assignment   Unit Outcomes   •    Create an ordered list •    Create an unordered list •.ZIP

Unit 3 Assignment Unit Outcomes • Create an ordered list • Create an unordered list •

Unit 3 Assignment 

Unit Outcomes 

•    Create an ordered list •    Create an unordered list •    Examine fonts and apply different fonts to your Web pages •    Prepare an external styles sheet and use CSS to create standardized web pages   

Course outcome(s) practiced in this unit: 

IT117-2: Modify a webpage to enhance its appearance using basic web building blocks 

Details of complete assignment content, deliverables and rubric   

Assignment Instructions are located in the PDF below (click the Rubric icon). 

Submit your Assignment to the Dropbox for this unit. Be sure to review the grading rubric before you begin. 

Remember: All of your Web pages should include the DOCTYPE statement above the opening html tag, like this: 

<!DOCTYPE html    

All your Web pages are also required to contain the <title tag pair within the head section, like this: 

<html <head <titleYour Name, Career Information</title </head 

Assignment Instructions: Assignment Instructions: 

Unit 3 

The project for this week includes two parts: 

Part 1: Create a new Web page named career.htm Part 2: Edit and revise the external CSS file named externalstylesheet.css 


Part 1: Create a Web page 1. Create a Web page and name it career.htm and make sure it includes the basic html tags; html, head, title, and body. 

Use the <h1 tag for the heading at the top of the Web page. (e.g., “My Career Future”) and use <h2 tags for subheadings. 

3. Create an ordered list to apply to the following: 

• At least two possible career choices • Potential salary scale for each career 

Create an unordered list to apply to the following: • Skills and education you already possess to work in your chosen field • Skills you plan to learn in the future. 

Conduct a search for job titles such as Web designer, Web developer, etc. 

Choose either a nationwide search or one specific to your region. A good place to start your search is the US government’s Occupational Outlook Handbook at 


1. Add a link to externalstylesheet.css in the head section of career.htm. (hint: Just like you did in bio.htm and index.html) 2. Use h1 tag for the name at the top of the Web page. (e.g., “My Career Future”)  3. Use the following tags where appropriate:  a. <p paragraph  b. <br / line break  4. Save and close career.htm  5. Upload career.htm to your Web space  6. In your browser, type the complete URL to view career.htm live on the Web.  

Part 2: Revise externalstylesheet.css 

1. Open “externalstylesheet.css” in Notepad. 2. Edit and modify values of the CSS body rule to change the formatting for each property. 

Remember, the values follow the colon. For example, #ffdfd0 is the color that will be assigned to the body background property. Change these values to your own choices.

Body { background-color: #ffdfd0; font-family: Times New Roman, Garamond, Serif; font-size: 18px; color: #00008b; } 

3. Next, do the same thing to the H1 CSS rule. Change at least 2 of the 3 property values. H1 { text-align: center; font-family: Arial, Verdana, Sans-Serif; color: #0000ff; } 

4. Save your changes to externalstylesheet.css. Make sure to change the “Save as Type” to “All Files” so the .txt file extension is not appended to the end of the file name. 

6. Upload your modified externalstylesheet.css file to your Web space. 

7. View career.htm live on the Web again and note the differences the modified CSS file made to the appearance. Also view index.html and bio.htm live on the Web and note the changes. Since externalstylesheet.css is linked to all three files, all will have the same style attributes.

Powered by