Tutorial #3:
Working With Text

Other tutorials
The Basics
The Basics - Part II
Working With Text
Text - Part II
Making Links
Images
Lists
Tables
CSS
CSS Text Control
CSS-P
Frames
Forms
JSS
Layers
Colors
Marquees

THIS TUTORIAL IS VERY IMPORTANT!!! This is one of the main things needed to make a good web page.

Take a look at this simple code...

<font size="5" color="red" face="arial">Result of HTML string</font>

What does this mean?

The first thing to put in is the <font>. This tells the browser that the font will be manipulated. The next three things don't have to be in order, and you don't have to use all of them if you don't want to. Just thought you'd like to know. The font size obviously controls the size. There are seven different sizes and two different ways to show them:

Size 1
Size 2
Size 3
Size 4
Size 5
Size 6
Size 7

The default is size 3, unless you set it otherwise in your browser.

This is H1 Text


This is H2 Text


This is H3 Text


This is H4 Text


This is H5 Text

This is H6 Text

There are only six 'H' tags.

Do you understand? Good. The next thing is manipulating text color. The font color, like the background color, can be written in two different ways. First, normally, and second, the hexadecimal way. You can use basic colors like red, orange, yellow, etc. However, when you choose your font color, make sure it is readable without straining your eyes. Don't use yellow on a white background, for example. To make use of the header text, put in <h1> or <h2>, etc. When finished, use </h1>, </h2>, and so on.

The last thing is working with the font face. Faces include:

Times New Roman
Arial
Comic Sans MS
Calligrapher
Librarian
Bazooka

If you don't get these fonts, then your browser doesn't support them. So it is best to stick with simple fonts such as Times New Roman or Arial. If you're asking what happens if you don't put anything in, the answer is unclear. In your web browser, you can set what you want the font size, color, face, etc. to be.

Make sure you use </font> to finish it off!

What else can I do?

The next thing you can do is apply some basic facelifts to your document. Some simple effects:

<b>This text is bold.</b>
<i>This text is italicized.</i>
<u>This text is underlined</u>
<blink>This text is blinking</blink>
<b><i><u><blink>This has it all, man.</blink></u></i></b>

One minor thing: The blink tag might not work in Internet Explorer, but you shouldn't use it anyway.

Text Alignment

The last major thing that you need to know about is text alignment. I have encountered three ways of doing this. Here's the first and most commonly used as of right now.

<center>

Use </center> to finish it off. That's all there is to it. Recently. with the release of HTML 4.0, a new way has appeared. The usage goes hand in hand with CSS, but you don't have to have a style sheet in order to use it.

<div align="left">
<div align="center">
<div align="right">

When you're done with your specified align, use </div> to finish it off. The final way is a way that I rarely ever use. It is like this: <p align="left", "center", or "right">. It is in the typical <p> tag, and when you are done, you must input </p>.

You now know how to create a web page and modify text. The next thing you want to do is learn how to create links. Go there now!