Kioshi Help Page

Links to the good stuff:

Images * Links * Tables * Forms * JavaScript

The Basics:

HTML is really just a text document!
Those silly commands are just format tools.

HTML is similar to .RTF (rich text format) or even .DOC (MSWord). If you view any of these files in a plain-text viewer/editor, you see the text interspersed with special format commands. The format commands for HTML are called "tags". Many of the tags used are obsolete, but many writers use them to allow visits from older browsers as well as be prepared for future versions of HTML. As an example, the <HTML> tags aren't really needed, because HTML is so common, but the tag does distinguish a difference from VRML, another writing language.

Tags are enclosed in "less than" (<) and "greater than" (>) symbols for easy recognition. People usually capitalize tags so that they stand out in a text editor.

Tags are used in pairs. The first tag is simply the command tag. The second tag has the command preceded by a slash (/) to signify that command no longer applies. By having closing tags, not only do you specify where you want a format command to end, but you can also "nest" tags.

"Nesting" allows you to use multiple format commands on a single section. Instead of just bold text, you can have bold, underlined text. Don't foget to "turn off" the underline or boldface.

Tags:

This tells the browser what language you're using. You don't need these tags for the popular browsers, but it's a good idea to use them just in case. They surround the entire document!

This sections off an area for header information. Usually, people only put a

Simply place the title of your page between these tags. The title does not appear on the page. Many browsers write the title in the browser's title bar (top of the window).

This sections off the main body of your page. This is where your text and pictures go. This is also where you can set attributes for your page!

Normal text is black. The page is either white or gray, depending on your browser. You can change this by setting the attributes of the

tag.

BGCOLOR	sets the background color
TEXT	sets the color of the text
LINK	sets the color of "links" to other areas
VLINK	sets the color of links that the visitor has already used.

To "set" an attribute, include it the first tag, and equate it to something.
EXAMPLE:

would change the background to black. Of course, now you would have to change text color; otherwise, you're writing black on black!

You don't need the quotes (") unless you are using a color with a space ( ) in it, like "DIM GRAY". Most newer browsers support color names for a wide array of colors. Older browsers used a hexidecimal RGB number.
The last command would look like
<BODY BGCOLOR="#0E0E0E" TEXT="#FFFFFF">
Each of the three pairs represents a color channel, manipulating these can give you custom colors!

You do not put attributes in the closing tag.

Body Tags:

ltH1&></H1>, <H2></H2>, <H3></H3>, and <H4></H4> These are "Headlines", <H1> being the biggest and most important, the others progressively smaller. You rarely have to use <H1> more than once on a page. <H1> is usually reserved for a title that is seen on the page.

This is a <H1> headline

This is a <H2> headline

This is a <H3> headline

This is a <H4> headline

Notice that

This is <H4>

and this is boldface
(<H4> is not bold, but it is a slightly larger font.)

Headlines are always separated by a blank line from other text, but are otherwise similar to nesting a boldface tag with a font size increase tag.

<P></P> The mighty paragraph tag! The <P> tag is rarely closed (</P>) anymore, since another <P> or headline "overrides" the previous tag and starts a new paragraph. Normaly, this tag inserts a blank line between text. It does, however, have an attribute that helps format text. The attribute for <P> is "ALIGN".
<P ALIGN="CENTER">
You can also ALIGN the text to the LEFT and RIGHT sides of the screen. The alignment only lasts for the specified paragraph, and must be specified again in a new paragraph. Headlines can also use the ALIGN attribute.

<CENTER></CENTER> If you want to center items other than text or several paragraphs at once, use the <CENTER> tag.

<CENTER>
<P>your text
<P>more text
<P>still more text
<P>even more text
</CENTER>

is a little easier than

<P ALIGN="CENTER">your text
<P ALIGN="CENTER">more text
<P ALIGN="CENTER">still more text
<P ALIGN="CENTER">even more text

<BR> If you don't want a blank line between two separate lines of text, use <BR>.

<B></B> or <STRONG></STRONG> This gives you boldface type.

<I></I> or <EM></EM> This gives you italic or emphasized type.

<U></U> This gives you Underlined type.

<FONT></FONT> This allows you to change the text size, color, and typeface (if available).

This shows you <FONT SIZE="+1">.
This shows you <FONT SIZE="+2">.
This shows you <FONT SIZE="+3">.
This shows you <FONT SIZE="+4">, if available.
This shows you <FONT SIZE="-1">.
This shows you <FONT SIZE="-2">.
This shows you <FONT SIZE="-3">, if available.
This shows you <FONT COLOR="RED">.
This shows you <FONT COLOR="BLUE" SIZE="+2">.

You should always put quotes (") around the size number; MSIE sometimes ignores the size change otherwise.

You can also use <BIG></BIG> and <SMALL></SMALL> to go one size up or down.
Netscape allows you to nest these tags, e.g. <SMALL><SMALL>really small text</SMALL></SMALL>.
MSIE only likes one <BIG> or <SMALL>, and it often will ignore the tag completely if is duplicated, depending on its mood.

Congratulations! You are now prepared to do some serious damage to the internet!

This Page Last Updated ,( Jan /),(

[GC] Pictures Captioned for the Graphically Impaired