Mote Interactive

Tags and Simple XML Tutorial

Tables

Tables are HTML's solution for laying things out on a page in certain locations. Before CSS (more about that later) came along, it was hard for a graphic designer to precisely place images and text on the screen. Tables provide a complex solution to a simple problem and I won't go into too much detail on them here. They are reminiscent of XML.

<table border="2" width="200">
<tr>
<td>Basketball</td>
<td>Football</td>
<td>Hockey</td>
</tr>
<tr>
<td>Point Guard</td>
<td>Quarterback</td>
<td>Center</td>
</tr>
</table>

would display:

Basketball Football Hockey
Point Guard Quarterback Center

Tables are another unforgiving part of XML. It's not case-sensitive, but the structure is very strict. It's easier to get Dreamweaver or another HTML editor to build tables for you.

Links to other pages

Linking to other pages is simply a matter of putting an anchor link around the text you'd like to use as the link.

eg. <a href="index.htm">Home Page</a>

would make: Home Page

The "a" is an "anchor". The "href" attribute refers to the http referrer you'd like to have someone go to when they click on that text.

 

Image Tags

Displaying images in web pages is as easy as making an "a href" tag.

<img src="../jpegs/peppers_sm.jpg">

There is no closing </img> tag in HTML. The "src" attribute refers to a link to the online location of the jpg or gif you want to display.

Other attributes of the <img> tag are width and height. For example, <img src="../jpegs/peppers_sm.jpg" width="100" height="20"> would yield:

Width and height are measured in pixels. As you can imagine you can put image tags inside tables...

MORE TUTORIALS