Objectives: Index | Definitions| Previous | Next |
Changing Text
- Re-open the workspace for your web page.
- Make changes in your HTML document using the text editor.
- Reload the document in your web browser to see your changes.
Working in Several Windows
1. Close all the windows except this one.
2. Open a 2nd web window and open your "practice.html".
3. Open the text editor again and open your "practice.html".If you can see all 3 windows, you're successful!
Now let's make it more exciting!
4. Delete the HELLO! and type this between the <body> and </body> tags:
Making Web Pages Saturday, February 1, 2003 9 a.m. (prompt) to 3 p.m. Emery High School 1100 47th Street Emeryville, CA 94608 Can I make a web page in 5 minutes? How can I use a web page? How can I do the neat things I see on other web pages?5. Save it and look at it in the browser.
(You MAY be able to save time by saving the practice.html and then dragging its icon onto the browser page.)It doesn't have any line breaks or different colors of text, does it?
So, let's pretty it up!6. Put <br> to break the lines or <p> to put a line space between them. (These tags don't require the usual </>tag.)
7. Save and look at it as a web page.
8. Try different fonts:
a. <i> and </i> for italics. b. <b> and </b> for bold.
c. <u> and </u> for underline.
d. <tt> and </tt> make typewriter style.
e. <font color=red> and </font> for colors. You can use 2 digits or letters (0,1, . . ,9, A, B,. . ,F) for red, then 2 for green, and two for blue. For example, 00FF00 is FF for totally green and nothing for red and blue.
See htmlhelp.com for RGB colors and text on different backgrounds.f. <font size=+1> increases the size, while <font size=-1> decreases it.
g. You can use headings from 1 (smallest) to 6 (largest):
<H6> text </H6>h. <font face="symbol">p</font> makes the Greek letter p.
Be sure to add the end tag for any change.
9. You can change the color of the page by inserting a background (bg) color into the body tag: <body bgcolor=330033> is lavender.
WARNING: too weird of combinations of colors or too many changes, identifies a novice who is giddy with the possibilities. Remember, you want people to read your web page easily!10. Align the text: You can insert alignments into the <p> tag:
<p align=left> or <p align=right>. Use </p> after that text, or it will continue.
To center something, you need to make a new paragraph:
<p><center> text </center>11. Make a horizontal line by using <hr>. You don't need </hr>. You can make a shorter line: <hr width=50%>
12. Now format the text about this workshop so that it looks (somewhat) like what I've done:
Saturday, February 1, 2003 Can I make a web page in 5 minutes?
9 a.m. (prompt) to 3 p.m.Emery High School
1100 47th Street
Emeryville
How can I use a web page?
How can I do the neat things I see on other web pages?
13. Save and look at it.
14. Check the "Source" for mine to see what we did differently.
If you haven't made ANY mistakes with the slash, eliminate one in your sample and see what it does!
Project Contact: Andria Erzberger
Last Update: January 6, 2003