hitmill.com
link to hitmill.com home page

 

 

HTML Table Tutorial Lesson 2h
The FRAME Attribute of the TABLE Element


 

A free HTML tutorial about the FRAME attribute of the TABLE element which allows the creation of partial borders on tables.


 

First I would like to say that the FRAME attribute of the <TABLE> tag is in no way connected to HTML Frames. That is an altogether different topic. This FRAME attribute has to do with making partial borders around tables. First I will show you a table, then I will share the code, so you know to do it. (Some browsers will not yet support the frame attribute of the table tag. Internet Explorer will support the FRAME attribute of the TABLE tag, so use Internet Explorer for your testing.) If you use the FRAME attribute your tables will not display correctly in the browsers that do not support the FRAME attribute of the TABLE tag. Your tables and pages may be skewed and look terrible in those browsers not supporting this attribute.

FRAME=HSIDES

HSIDES means that the top and bottom horizontal borders will appear:

FRAME="HSIDES"

<TABLE FRAME="HSIDES" BORDER="4" CELLSPACING="4"
CELLPADDING="10" BORDERCOLOR="red" ALIGN="center">
<TR VALIGN="top">
<TD><FONT SIZE="4">FRAME="HSIDES"</FONT></TD>
</TR>
</TABLE>

Note: When you code FRAME=HSIDES you need to still specify the BORDER width for the outer part and if you want a second fine line with it, you have to code CELLSPACING. The effect will not show up well on certain backgrounds unless you also code a BORDERCOLOR for your partial frame.


 

FRAME=VSIDES

FRAME=VSIDES will render vertical frames on the left and right edges of the table:

FRAME="VSIDES"
<table frame="vsides" border="4" cellspacing="4" bgcolor="cornsilk" bordercolor="green" cellpadding="10">
<tr valign="top">
<td><div class="again" style="margin-left:0; margin-right:0">
FRAME="VSIDES"</div>
</td>
</tr>
</table>

See what happens now if we add more than one cell to a table that has vertical borders:

Row 1: Column 1 Row 1: Column 2
Row 2: Column 1 Row 2: Column2

The vertical borders lose their effectiveness, the table has become sloppy and looks like "something is missing". Adding a subtle background color would help to restore some cohesiveness to the table. Another thing to keep in mind is that not all browsers support the FRAME attribute of the TABLE tag.


 

 
Search Tutorial | Web Services
 
Top | News | Travel | Computers
Internet | HTML | Dynamic HTML | XML
Programming | JavaScript | ASP | Home
 

 
Contacts
 
Updated
© hitmill.com
All Rights Reserved