Text Formatting and HTML

Stay at Home and Learn

Web Design Tutorials

Text Formatting in HTML

Computer Tutorials List

Colour, Headings, Centre

Getting text into your web page is quite easy - just start typing between the two BODY tags. When you save your work and view it in a browser, the text will appear without any special formatting. You don't need to specify a type of font to use, or a colour, or a size. This is because browsers are set up to use defaults when no instructions are given.

Text formatting, in html terms, is when you give the browser instructions on how your text should look. These instructions come in the form of tags, and you'll learn these now.

Colour

You can specify which colour you want to use for all the text on your web page. The browser default is black, so you only really need to specify a colour if you don't want black. Here's how to do it.

Start your HTML Editor
Click File > New
Set a background colour and click OK
When you see the code, locate the first BODY tag
Click your cursor after the "Y" of BODY
Press the spacebar on your keyboard
Type in TEXT =
Then type a colour for your text
In between the two BODY tags, start typing you text
Save your web page, and then view the results
In the code below, the text has been set to Blue

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY TEXT = Blue>

</BODY>
</HTML>

If all you want to do is to change the colour of some text between the BODY tags, your HTML editor has a quick way of doing that.

Highlight the text whose colour you want to change
From the menu bar, click on Format > Text Colour
The Colour dialogue box appears
Choose a colour by clicking on a colour square
Click OK

Headings

You've already met the Headings tag. If you'll remember, the Heading tag uses the letter "H" followed by a number. Like this:

<H1>My Heading</H1>

or like this:

<H4>My Heading</H4>

The heading tag increases or decreases text size above or below the default size. The default size is 3. The biggest size is 1, and the smallest 7.

The heading tag will automatically insert a line break for you, so you don't have to insert a <P> or <BR> tag after it to start a new line.

To insert a Heading tag with the HTML Editor, click on Insert > Heading then choose a Heading size. Only size 1 to 4 are used in the editor. But bear in mind, you can go as low as size 7.

When you click on a heading size, the beginning and end Tag will be inserted with the cursor flashing between the two:

<H1> </H1>

The forward slash, remember, tells the browser to stop formatting a tag. In this case, stop formatting the H1 heading tag.

With the cursor flashing between the two tags, type your text for the heading.

Centring Text

To centre text (and anything else on your page), the CENTER tag is used. Note the American spelling, with "ER" at the end and not "RE". To centre something with the HTML Editor, do the following:

Highlight whatever you want to centre
From the menu bar, click on Format > Centre
The two CENTER tags will surround your highlighted text
Save your work and view the results in your browser

Move on to the Next Part -->

<--Back to the Web Design Contents Page

View all our Home Study Computer Courses