QuickRead 3: The basic tags
| The paragraph tag <p> | ||||||||||||||||||||||||
| You can use the <p> tag to ensconce your text. Some HTML tags are like
rare English words. You use them just because you know them. The paragraph tag eluded me for a long time
until I found quite a few uses for it. It's all over my pages now. It is kinda like putting a blank
line between the last section and what you are about to write. Here's the basic rub: <p> Insert paragraph1 here </p> <p> Insert paragraph2 here </p> You can have your text ensconced directly in the body of the html document. If you use the paragraph tag for each of your paragraphs, you will have a neat margin between paragraphs. The closing tag is not strictly enforced and can therefore be omitted. There are some attributes that can be used with the paragraph tag but we won't worry about them now. | ||||||||||||||||||||||||
.
| .
| The Heading tag
<h number>
| Backstreet boys suck[h1]<h1> Backstreet boys suck[h1] </h1>Backstreet boys suck[h2]
<h2> Backstreet boys suck[h2] </h2> Backstreet boys suck[h4]
<h4> Backstreet boys suck[h4] </h4> Backstreet boys suck[h6]
<h6> Backstreet boys suck[h6] </h6> .
| .
| The Break tag
<br attributes>
| When you type a sentence to appear either in a Paragraph or otherwise, it won't
take long for you to notice that the sentence does not break till it touches the browser frame. Use the
break tag to... what else, break, away from the current flow of text or to introduce blank lines in the
page. | It's bad karma to misuse the break tag like this The above statement would have appeared as: It's bad karma to misuse the break tag like this if it weren't for the blessed <br> It's <br>bad<br>karma<br>to<br>misuse<br>the break tag<br>like<br>this<br> <br> The break tag is one of the few tags in HTML that does not have a closing tag. Also, note that pictures work the same way, they don't start on the next line unless your break the last one. .
| .
| The Horizontal Rule
<hr atttibutes>
| To demarcate sections of your Web pages, you will find the horizontal rule
useful. It can be made to look ugly with some attributes we will go over in just a while. | Here's the horizontal rule at it's elementary and probably most pretty state: The tag to use is <hr> and yeah, this is another HTML tag that does not have a closing tag. Here are its attributes: That was a <hr size=30 width=100 shade> That was a <hr size=15; width=200 noshade> That was a <hr size=1; width=400 noshade> <hr width=75%> Because horizontal lines look like sticks, the "size" will be described as the girth of the stick. It can be set by a pixel amount, while the width can be set by a pixel or a percentage amount. Pixels are an unit of measurement like inches or centimeters. Take another look at the second horizontal rule to get an idea of how big 100 pixels gets. If you are using the pixel scale, you can leave a "px" next to the amount, like 100px, or you can choose to omit it as the a number will be regarded a pixel amount by default. If you omit the attribute altogether, the horizontal rule will use a default value of 3 pixels for the size. Just so you know, the resolution you run your monitor (say 800 by 600 or 1024 by 768) is the pixel count horizontally and vertically. What this means to you as a web designer is that pixels aren't the same size from computer to computer. This is why most people prefer percentage for widths. The percentage measurement refers to the percentage of the screen that
you want the rule to occupy. The default width is 100%. What no shade
does is difficult to describe. It, well, marks no shade. The noshade line at size=1 looks really neat.
. | .
| The Center Tag <center>
| To center a section of your webpage you use the
<center> tag. In general you would say something like | <center> Some stuff to center.... more stuff ... </center> Which would look like: more stuff ... .
| .
| Tag etiquette
| If you opened a tag, make it a point to close it. There are many
tags for which non-closure does not lead to a nuclear meltdown. Actually nothing you will
do can ever amount to a disaster in HTML (unless you use h1 size aqua blink on a lime
background!!). But there are issues: for instance, not closing a table in Netscape can
make the whole table not appear. Unlike other languages that insult you with hundreds of
errors, HTML was designed to quietly disregard any tag it does not understand. If you have
not closed a tag, it continues with the properties defined in the tag till the end of the
document or till a stray closing tag is encountered. Don't overlap your closing tags with
other closing tags. If you had opened <font> first and then opened <p>, you
must close <p> before you close <font>. Some times, this does not affect the
display, but many other times the whole page becomes unworkable and the error can be hard
to find. Also, when assigning values to attributes, be careful to close quotes around the
values. | width="300" : correct. width=300 : also correct. width="300 : incorrect. width=300" : incorrect. Do: <font>Here I <p> go again.<p> </font> Don't : <font>Here I <p> go again. </font> <p> .
| .
| Get behind the wheel!
| Try typing out the following: | <html> <head><title>Insert Title here</title></head> <body> <h1>Insert Heading here</h1> <hr> <p>Where are we going to go?<br>I guess wherever the captain wishes to take us</p> <p>Planet Azok! Hmmm..long time no see.</p> </body> </html> .
| |
| Index |
| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |