LESSON 05 – CSS REVIEW

WORK

TASK 1

Create a basic html document that includes the sections shown in the box below. Use only div tags for each section.

Title

Subtitle

This is a nice long paragraph. It consists of enough material to go have several lines of text. Yes, you might need to image this here but on the student pages, it will be longer.

<Image>

Image Caption

Favourite Site: Google

TASK 2

Inside a CSS file, you will add the CSS rules to make format each section. Below is a list of how each section should be formatted.

• Title
• Enlarged font
• Font type: Arial
• Font color: White
• Centered
• Bolded
• Background colour: Dark Gray
• Border colour: Dark Gray

• Subtitle
• Enlarged font (smaller than title)
• Font type: Arial
• Font color: White
• Centered
• Bolded
• Background colour: Dark Gray
• Border colour: Dark Gray

• Paragraph
• Font color: Black
• Left Border: Dark Gray
• Right Border: Dark Gray
• First letter should be enlarged (like in newspapers)

• Image
• Needs to be centered
• Needs to be continue the borders that are on each side the of the paragraph.

• Image Captions
• Small font
• Font colour: Black

• Centered under image
• Needs to be continue the borders that are on each side the of the paragraph.

• Favourite site
• Label is black
• Link is blue

• Link becomes brighter blue when mouse is over it.
• Needs to be continue the borders that are on each side the of the paragraph.

• Needs to also have a similar border at the bottom.