HTML Tutorial by: ranjith

Page: 1 of 5 (View All)

Basics of HTML

Learning HTML is rather simple when compared to other languages. This simplicity is due to the usage of simple English words as a building block of a HTML page. These English words are known as

Structure

HTML documents are composed of two parts: the head and body. The head part contains the document specific information

Paragraphs

Paragraphs are probably one of the most inevitable parts of a document. The HTML provides you the <p> tag to add paragraphs to a document. The closing tag is </p> but it is optional.

Text Formatting

In order to make your web page look striking you need to format your textual content suitably, HTML offers a significant number of formatting tags for this need. <b> and </b> for bold, <i> and </i> for italics <u> and </u> for underlined and <tt>and </tt> for typewriter are the normally used formatting tags. Developers can make a sentence displayed using a particular font and size using the <font> </font> tag. This is accomplished by adding the face=

Images

Most of the interactive websites you click to will contain an array of images which makes the website more productive. HTML gives you the <img src=

Tables

Tables are one of the most vital concepts in HTML. Tables are used to make the data easier to interpret or just to give your document more impact. It may take a while to get accustomed with tables. Table starts with an <table> tag and must end with an </table> tag. If you forget to put the ending tag the table will not show up at all.

Table borders

HTML gives you the option to enable or disable border of a table. You just need to place a border=n attribute within the opening tag if you want give border to table. Usually when you do not specify the border attribute the table border will become invisible. If you give border=1 a thin border will appear around the table conversely, if your requirement is a much larger border you need to set values for the border tag accordingly.

Table Rows and Cells

By adding a mere <table></table> tag gives you only a basic outline of a table, to make the table productive you need to use the <tr></tr> and <td></td> tags. The <tr></tr> tag when placed inside the <table></table> tag will add a row to the table. If you need to separate the rows into smaller parts (often known as cells) you need to put <td></td> tag inside the row tag.

Many times, you will need a heading for a column of cells of the first row. To add this you will use the <th> opening and </th> closing tag. The table heading tag makes the text in that cell BOLD and CENTERED. You only need to use the heading cells when necessary.

You can also combine two cells of same or different rows if you want. Suppose you need to combine Cell One and Four to be combined or Cell Two and Cell Three to be combined. In order to do this, you can use the rowspan=n or colspan=n attributes in the <td> tag. The rowspan=n allows you to combine roes and colspan=n allows you to combine columns or cells. The other major attribute you can use with the <td> tag is the align attribute which when used the content of the cells will get aligned. See example below:

Appendix:

CrystalGraphics offers many Web design products that can help you with your Web site. It has FrontPage website templates, Flash animations, 3D graphics, photos and more.