6E. HTML Fonts Webpage

A very simple HTML document

  1. Replace the text.
  2. Copy and paste the code into Dreamweaver.
  1. Then save the page as 6e. Fonts.html in your folder.

Setting Up your Web Site in Dreamweaver

Dreamweaver CS4/CS5 site set-up

Dreamweaver Setup

Write your name for the Heading.

Copy a three paragraph essay that you wrote on your blog.

Add the title as a header.

Save the page as 6e. Fonts.html in your folder.

HTML headings

Add 3 different size headers with the date, class name and school.

Set the font of text

Make each paragraph a different font text.

Set the font size of text

Make each paragraph a different font size.

Set the font color of text

Make each paragraph a different font color.

Set the font, font size, and font color of text

Make each paragraph a different font text.

Make each paragraph a different font size.

Make each paragraph a different font color.

Good background and text color

Bad background and text color

Change the background to a color other than white.

Change the text color that can be easily read with your color background.

Don't forget to save your pages.

Save the page as 6e. Fonts.html

Webpage E2 Backgrounds

Edit your webpage 3B. Simple HTML Webpage

Make the changes below:

Using styles in HTML

Add an HTML Style for text elements.

Make:

  • All header 1 elements A different color
  • All header 2 elements A different color
  • All text in paragraphs A different color

Good background image

<body background="Paste Image Location.jpg">

Good background image 2

<body background="Paste Image Location.gif">

Bad background image

Add a good background image. The text should be easy to read.

Change the text color so that it can be easily read with your image background.

  1. Replace the text.
  2. Copy and paste the code into Text Edit.
  3. Then save the page as e2background.html in your folder.
  4. Turn it in on Engrade.

Add Backgrounds to all your Webpages from now on.