OVERVIEW:
HTML stands for Hyper Text Markup Language. It is the language of the internet. Web browsers like Netscape
Communicator and Internet Explorer use HTML to display web pages. HTML is different than other computer languages because it is much easier to learn. Another important point is that HTML is not case sensitive so "text" is the same as "TEXT"
HTML uses tags extensively to differentiate text. An HTML tag is a coded command used to indicate how part of a Web page should be displayed. A starting tag usually starts with angled bracket like (<) and the ending tag ends with angledbracket (>) usually followed by /. Every HTML document contains some required tags like<html>, <head> and <body> Lets look at the sample HTML document
|
|
<html>
<head>
<TITLE>HTML Example</TITLE>
</head>
<body>
<H1>Hello there</H1>
<P>This is a test paragraph </P>
</body>
</html> |
Hello there
This is a test paragraph
|
Every document starts with the <html> tag and ends with the </html> This tells the browser that this is a HTML document. The document is divided into two sections head and body. The head contains document information like title and other pertinent information on your web page. This information is not seen by the person browsing the page. The second part of the page is the body. This is the part of the page visible by others. Notice the tags usedhere <P></P> is used for paragraphs and<H1></H1> is used for headings. There is more info on these in the next few sections.
BODY:
The body is where most of the information about your web page will be. So let us discuss some of the bare essentials you need to know.
Headings like the one above start and with H# where # is a number from 1 to 6. This gives you six different levels of headings. If you want big headings use H1 and if you want small headings use H6. Look at the examples below
<H1>Heading 1</H1>
<H2>Heading 2</H2>
<H3>Heading 3</H3>
<H4>Heading 4</H4>
<H5>Heading 5</H5>
<H6>Heading 6</H6>
will give you the headings below
To control where line and paragraph breaks actually appear, you must use HTML tags. The <BR> tag forces a line break, and the <P> tag creates a paragraph break. The only practical difference between these two tags is that <P> inserts an extra blank line between paragraphs, and <BR> does not.
|
|
<body>
This is with a line break<p>
This is without the line break<br>
This is the next line<br>
</body> |
This is with a line break
This is without the line break
This is the next line |
Notice how the tags are placed in the end of the text. If you place the tags in the beginning, you will get the blank line before the text.
If you want to place a horizontal rule to separate a section of text, you can use the <HR> tag. Here is an example
|
|
<body>
This is with a horizontal rule<hr>
This is without the line break<br>
This is the next line<br>
</body>
|
This
is with a horizontal rule
This is without
the line break
This is the next line |
If you want to place the paragraphs at different starting points, you can use the ALIGN statements. Look at the HTML code below
<p align=left> This is a paragraph starting
at the left
<p align=center> This is a paragraphstarting in the center
<p align=right> This is a paragraphstarting in the right
will give you this text in the browser
|
| This is a paragraph starting at the left |
|
|
| This is a paragraph
starting in the center |
|
|
| This is a paragraph
starting at the right |
|
Hyperlinking to other pages:
As your website grows in size, you will need to add links to other pages or even other websites. This is done by creating a hyperlink to that page. Here are the tags needed to create a hyperlink
<AHREF="----"></A> where
A stands for anchor
HREF stands for Hypertext Reference
"----" contains the URL (Uniform Resource Locator) aka the address of the page your are trying to link. Here is an example of a hyperlink
<body>
<A HREF="http://huagui.tripod.com">Solution for database applications</A>
</body>
When you see the above code in a web browser, it will look like this
Solution for database applications
Here the user sees only the text after the URL. When the user clicks on the text, the browser opens the
web page huagui.tripod.com. The underline is used to show a hyperlink in web pages.
When you create a link from one page to another page on the same website, it isn't necessary to specify a complete Internet address. If the two pages are in the same directory folder, you can simply use the name of the HTML file, like this:
<body>
<A HREF="pagetwo.html">Click here to go to page 2.</A>
</body>
This will take the user to the
second page on your website.
Bold and Italic text:
For boldface text, put the <B> tag at the beginning of the text and </B> at the end. Similarly, you can make any text italic by enclosing it between<I> and </I>. If you want bold italics,put <B><I> in front of it and</I></B> after it. You can also use italics within headings, but boldface usually won't show in headings because they are already bold.
<B>This text is BOLD</B><br>
<I>This text is Italic</I><br>
This will look like this in the browser
This text is BOLD
This text is Italic
Here are some more tags and their functions
| Tag |
Function |
| <SMALL> |
Small text |
| <BIG> |
Big text |
| <SUPER> |
Superscript |
| <SUB> |
Subscript |
| <STRIKE> |
Strikethrough (draws a line through text) |
| <U> |
Underline |
| <TT> |
Monospaced (typewriter) font |
| <PRE> |
Monospaced font, preserving spaces and line breaks |
| <STRONG> |
Strong (boldface) text |
If you want to display a list of things, you have two choices, numbered or unnumbered. If you want a numbered list, you will use the following text
|
