Click Here!
  Web Development, Web design, HTML code, HTML tutorials, Javascripts, DHTML, ASP, Perl, CGI scripts  
YOU ARE HERE: Home : Articles : Introduction to HTML. Tables and Frames
Web Hosting  •  Website Tools  •  HTML Tutorials  •  PHP Resources
Introduction to HTML (Tables and Frames)
By Virtual Mechanics
Some of the more advanced features of today's HTML pages include Dynamic HTML and CSS capabilities that I have briefly discussed in past issues. Other advanced capabilities include Frames, Tables, Forms and Scripts. Each of these topics could have (and do have) entire books devoted to them. This week I will briefly discuss
Frames and Tables so that you will at least be able to recognize the code and refer to more extensive help if you wish.

Tables are used to collect images and text together into a series of cells that can be organized horizontally and vertically. A typical use for a table would be a monthly calendar. I posted a list of special HTML characters in a table several issues ago at is3fig1. Take a look at the source for an example of many of the options that can be used when constructing a table.

Here is a simple Table example:

<CAPTION>A Simple Table</a>
<TD>Box 11</TD>
<TD>Box 12</TD>
<TD>Box 21</TD>
<TD>Box 22</TD>


This example adds text to each of four cells over two rows. The TABLE tag is used to delimit the operation. You can also use this tag to assign a border, border style and cell spacing to the table cells. The <TR> tag is used to create a new row of table information while the <TD> tag is used to enter data into a table cell. You can also
assign a background color with the TD tag.

Almost any valid HTML can be placed into a Table. Instead of text you can use the image tag as discussed last week to add pictures to the cells and the anchor tag to add links. If you wish, you can even add other tables to a cell to create a table within a table. Table cells do not need to be evenly divided between rows and columns. The
<ROWSPAN> and <COLSPAN> tags can be used to create more complex table layout schemes.

Is10fig2 illustrates some of these more advanced table features.

Instead of HTML elements placed into cells, Frames are used to display entire HTML pages within rectangular regions of a browser. If you have ever looked at the source for a relatively complex web page only to discover that there is hardly any code, chances are the page was constructed using Frames.

Frames are actually quite easy to set up. Simply create the pages you wish to display together the way you would normally create them. You can then create a master page with the Frame tag to display these pages together. An example for a frame page is:

<TITLE>A Simple Frame Page</TITLE>
<FRAMESET cols="20%,80%">
<FRAME src="is10left.htm">
<FRAME src="is10right.htm">


In this very simple example, a Frame page is constructed to display two other pages. The page "left.htm" is displayed in a frame that occupies the first 20% of the left side of the screen while the page "right.htm" will be displayed in the remaining 80% of the screen to the right. These frame pages can be as simple or as complex as you wish and can be viewed independently. The two pages that make up the frame page above can be viewed separately at is10left and is10right

A page can be composed of as many horizontal and vertical frames as you wish. Take a look at is10fig4 for an
example of a far too complex use of frames. If you look at the source you will see that there are many additional attributes you can add to your frames including borders and scroll bars.

Next week I shall conclude this series on basic HTML with a brief discussion on Scripts and Forms.

Source: "IMS Web Tips" is a weekly news letter for all web site managers regardless of experience who are looking for detailed information on creating, maintaining and promoting their web sites.

To subscribe send an email to or visit for subscription information and a list of past articles.

More Articles


  " TARGET="_blank">...





More News  
[an error occurred while processing this directive]

Join our newsletter!
Join our eNewsletter
for software updates,
freebies and more!


Registered Worldwide
...more statistics

Click Here!


  Articles are submitted to EDN and licensed from various content sites.
  To report abuse, copyright issues, article removals, please contact [violations (at@)]

  Copyright © Evrsoft Developer Network. Privacy policy - Link to Us

Contact Evrsoft