Project 2

Objectives

At the end of this project, you will be able to:

  • Create an Embedded style sheet in an XHTML document.
  • Apply CSS styling to specific page elements.
  • Format text on a page for font, weight, size, color, and alignment.
  • Place images and create a bulleted list.

CSS Exercise

Requirements

  1. Folder name:  lastname_firstname_Gordo
  2. Document name:  gordo.html”
  3. Directory structure
  4. Embedded Style Sheet

Instructions

  1. Create an HTML document with the files provided.
  2. Name the file gordo.html.
  3. Place the information from the gordo_text.doc into your HTML document.
    Place elements needed into the document.
  4. Create an Embedded style sheet within your document.
  5. Give the page a background color of gray and width of 500px.
  6. Place a default of the font Georgia, serif, and color black.
  7. The default size of the fonts will be 14px.
  8. Place the image “famous_primate.png” at the top of the page.
    The image width is 500px and the height is 176px.
  9. The heading “Gordo” is 30px in size, centered and color light blue.
  10. The headings “Old Reliable”  and “The Mission” are 18px in size and color light blue.
  11. The paragraph format is justified with a line-height of 1.5em.
  12. In the first paragraph emphasize “one of the first monkeys” and make “Albert” important in the color white.
  13. Place the image called “gordo.jpg” after the first two paragraphs. The description of the image is “One of the first monkeys to make it into space.” The image width is 500px and the height is 350px.
  14. Change “IRBM” to white and placed in the meaning in the code: Intermediate Range Ballistic Missile.
  15. The headings “The Jupiter AM-13” and  “The Journey” are 16px in size and color light blue.
  16. All sub-headings are centered and the font is styled with Arial.
  17. Put “Flight Date and Launch Time” an unordered list.
  18. Put “Flight Time and Apogee” an unordered list.
  19. Place horizontal line before “References“.
  20. The heading “References” is 12px in size and color light blue. All letters are capitalized with letter-spacing of 0.4em.
  21. Put info under reference in a numbered list.
  22. Place files and folder into a folder: lastname_firstname_Gordo.

This is due at the end of class (Thursday, October 4, 2018).
Share folder link to Google Classroom > CSS Exercise.

Ask assistance if you are not sure about a specific task.


Files to Download
Gordo text

Primate Logo

Gordo image