HEADINGS

Now turn Hello? into a heading. Heading tags come in sizes from 1 to 6, with 1 being the biggest.

We're using size 1 so open the tag by typing <h1> directly in front of Hello! and don't forget to close the tag directly after Hello?. You may be able to work out what the end tag is, but in case you haven't it's </h1>

Now save and refresh in your browser.

Click on this link to see what you should have.

If your page doesn't match mine then if you go File/Source or File/Page Source in the browser window my page is in then you can see my code and compare it to yours.

Very often it can be one wrong or missing letter, space or puntuation mark that causes the whole thing to go up the swanny.

 


ALIGNMENT

 

Now centre Hello?

To do that we just place the instruction align="center" in the h1 tag so it should read <h1 align="center">. There's no need to put the instruction in the closing tag, but you do need to remember to spell center the American way.

Now save and view in your browser.

Click on this link to see what you should have.

 


TEXT FORMATTING

 

Irsert the following text after the end of the heading:

I'd like to take this opportunity to introduce you to my first Web Page. "What's it about?" I hear you say. Well, really, nothing at all. All I want to do is get this exercise over and done with, so I can go on and build my own site about something I find interesting. First, though, I've got to learn how to format this text, create hyperlinks, insert images, build tables and maybe a few other things. I have to say though, writing all this source code is a bit boring.

You can do this either by typing it out by hand or by highlighting the text and copying and pasting it into the document.

Next break the text up into three paragraphs. The tag for paragraph is <p>, and don't forget to give each paragraph an end tag! The paragraphs begin at I'd like... , Well, really... and I have to say though...

Set the alignment of the second paragraph as justify <p align="justify"> and the last paragraph as right.

Also embolden the last paragraph. The tag for this is <b>* at the front of the paragraph, with an end tag at the end.

Click the link to see what the new page should look like, and it's source code, in separate frames.


*Other formatting tags include <i>italic</i>, <u>underline</u> and <s>strikethrough<s>. Feel free to experiment with them.

 


FONTS & COLOURS

 

So far the text in your page will have appeared in your browsers default font (probably Times New Roman). However there is a <font> tag which allows you to set the typeface, size and colour of your text.

Font instructions tend to use a limited range of fonts that are likely to appear on all computers, and include alternatives just in case they don'ts. As Times New Roman is a Serif font we're going to change the text to a Sans Serif font, namely Arial, with Helvetica as an alternative.

We will set the size at 4 (sizes range from 1 (smallest) to 7 (biggest), and we'll colour the text in the last paragraph red and increase the size to 5.

The typeface instruction is face="Arial, Helvetica, sans-serif", the size instruction is size="4" or "5" for the last paragraph and the colour instruction for the last paragraph is color="red". Remember, don't include these instructions in the end tag.

Write the tags with instructions in where you think they should go.

Finally insert a line break <br> in between the words all and this in the final paragraph (note that the line break tag doesn't require an end tag),then save and view.

Once again click the link to see what the new page should look like, and it's source code, in separate frames.

The source code is starting to get a bit more complicated. You notice I've put different bits of code on new lines - this is to break it up so I can see what I'm doing. You may also feel it's worth your while to put in a few <!----comments----> to help tell you where you are. If so do it in a language you'll understand - it'll make editing a lot easier.


ON LINE JONES

home         back         CONTINUE TO IMAGES

Hosted by www.Geocities.ws

1