� at32,Wyn32 2002
| |
[ Home ]
| |
Web Design: at32 Webcraft
| | | |
at32 Webcraft
|
[ Learn HTML with WebCraft ]
Text
Now you have setup the basics for a page, whatever you type next (after the BODY tag that is) will instantly become proper text as if you were working in a word processor.
However, as you type - you may notice that new lines (carriage returns) do not actually become new lines on the webpage. This is because carriage returns are used in a HTML document to allow you to set out your HTML text so it's easily readable - you must use a HTML tag for new lines to appear in the browser. There are two methods:
<P>Hello my name is Fred.</P>
<P>Hello my name is Bob.</P>
|
...this is the paragraph tab. If you start each paragraph with a <P> and close it again with a </P> the new lines will automatically appear. The above example displays:
|
Hello my name is Fred.
Hello my name is Bob.
|
Of course, sometimes you want a blank line anyway, not just to separate paragraphs - such as for a list for example. In this case you would use the BR tag (line break) as shown:
Hello my name is Fred.<BR>
Hello my name is Bob.
|
This has a slightly different result:
Hello my name is Fred.
Hello my name is Bob.
|
...the reason being that a BR tag only adds a line break - so although each item is on a separate line, there is no blank line between them. To recreate this you would use:
Hello my name is Fred.<BR><BR>
Hello my name is Bob.
|
You can use any number of BR tags as you like - each one will create a new carriage return within the page itself - unlike the paragraph tag. Also try out the HR tag - this will create the following:
...which is a handy tool to have for introducing some basic formatting early on!
Font Control
Text by default appears in the Times New Roman font. This isn't bad and might be your thing, but sooner or later you're going to want to start experimenting with different fonts.
In WebCraft, right click on a space in your text and select Quick HTML > Large Text. Now, anything you type will appear in a font the same as this website, only a size slightly larger.
If you're familiar with typefaces, you can try changing the name of the font listed to something else. Here are some examples:
|
HTML |
Result |
|
<FONT SIZE=2 FACE="Arial"> |
Arial |
|
<FONT SIZE=2 FACE="Courier"> |
Courier |
|
<FONT SIZE=2 FACE="Courier New"> |
Courier New |
|
<FONT SIZE=2 FACE="Times New Roman"> |
Times New Roman |
|
<FONT SIZE=2 FACE="Verdana"> |
Verdana |
Size
Size is very simple - simply change the value within the tags shown above. Larger number provide larger fonts!
Color
Color is a more complex issue, and beyond the scope of this article. However, the tags provided so far are more than enough to get you going - you can find out more about HTML color here by following this link to these handy Lycos pages..
Blockquote
A powerful tool often overlooked is the BLOCKQUOTE tag. Surround text with this tag and you'll find that it will be nearly formatted and indented either side. Check out this example:
Hello my name is Fred.
<BLOCKQUOTE>
Hello my name is Bob.
</BLOCKQUOTE>
Hello my name is Joe.
|
...produces the following result:
Hello my name is Fred.Hello my name is Bob. Hello my name is Joe.
|
Bullet Points
Allocating bullet points is simplicity in itself, they'll even add a new line for you! Simply use the LI tag, like this:
<LI>Point One
<LI>Point Two
<LI>Point Three
|
...and you'll get:
|
Point One
Point Two
Point Three
|
[ Prev | Next ]
|
| | | |
|
