coolestcodes.jpg

Get more website traffic

Take Me Home
The Basics
Special Characters
HTML Color Codes
Tables
Text Effects


MySpace.com/CoolHTMLCodes

Tables are used when you want to organize your pictures or other stuff on your website in a row or two. You can have as many columns and rows as you like. But, keep in mind that tables can cause your page to load slower and CSS is the solution to this.

You Can Make Data Tables Online. It will help you to know exactly what a data table is and if you understand how to make Data tables, you will find that they are easier to make - anytime you want.
__________________________
Tables can add order to your website and keep your pages looking neat. There are some who say you should avoid HTML tables because they make the pages load slower and they do not adjust to the size of the screen. CSS is the solution and I will add those instructions - soon.
Q. What is a Data Table?
A. A Data table is information that is organized in an orderly fashion in rows and or colums.

This is a table

Q. What are the attributes of a data table?
A. The table itself will start like this <TABLE> and end like this </TABLE>.

Table Row  - TR - The table row is an individual row that contains a data cell. The cell is a grid [with]in the table.
Table Data - TD - The table data is the cellin the table row. If you end the TD </TD>, you will still have another cell beside that cell. If you end the TR </TR>, you are starting another row.

Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell

Align - When you align, you are assigning a particular place to the text or graphic within the cell. Such as <TD ALIGN=TOP> <TD ALIGN=LEFT>
Background - Bgcolor - You can change the background color with a simple HTML code. <TD Bgcolor=#FFCC00> or <TD Bgcolor=RED>. You can also add images to your table background.

Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell
Cell Cell Cell Cell Cell Cell

This is how you start a table - <TABLE>
This is how you end it - </TABLE>
If you do not end your table, it will [more than likely] mess up your entire page.

This is what it will look like:
↓ ↓ ↓ ↓ ↓ ↓

<TABLE BORDER="1">
<TR>
<TD> Text or Graphics </TD>
<TD> Text or graphics </TD>
</TR>
</TABLE>

Text or Graphics Text or graphics

<TABLE BORDER="0"> or <TABLE>
<TR>
<TD> Text or Graphics </TD>
<TD> Text or graphics </TD>
</TR>
</TABLE>

Text or Graphics Text or graphics Text or graphics

<TABLE BORDER="1">
<TR>
<TD> Text or graphics </TD>
<TD> Text or graphics </TD>
</TR>
<TR>
<TD> Text or graphics </TD>
<TD> Or even, another table> </TD>
<TR></TABLE>

Text or graphics Text or graphics
Text or graphics Or, even another table

Add color to your table background.
 
<table border="2">
<TR>
<TD Bgcolor="#FF00CC"> Text Here </TD>
<TR>
<TD Bgcolor="#00CC33"> Text Here </TD>
<TR>
<TD Bgcolor="#FFFFFF"> Text Here </TD>
<TR>
<TD Bgcolor="#CCCC00"> Text Here </TD>
</TR>
</TABLE>

Text Here Text Here
Text Here Text Here

<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="5">
<TR>
<TD Bgcolor="#333399">
COLSPAN=4 > Text goes all the way across.</TD>
</TR>
<TR>
<TD BGCOLOR="#339933"> Text </TD>
<TD BGCOLOR="#FF33CC"> Text </TD>
<TD BGCOLOR="#FF0066"> Text </TD>
<TD BGCOLOR="#FF3300"> Text </TD>
</TR>
<TD BGCOLOR="#0000CC"> Text </TD>
<TD BGCOLOR="#CCCC66"> Text </TD>
<TD BGCOLOR="#FF6633"> Text </TD>
<TD BGCOLOR="#009900"> Text </TD>
</TR>
</TABLE>

The COLUMN SPAN [COLSPAN] allows you to stretch text across the entire table.

COLSPAN="4" - Takes the text all the way across.
Text Text Text Text
Text Text Text Text

This is the table without a border.
Text Text Text Text
Text Text Text Text

Cellpadding - The padding can be close to the edges or there can be a space inside of each cell, all the way around.
 
<CENTER><TABLE BORDER="1" CELLPADDING=10> <TR> <TD><FONT  COLOR="#FFFF00" SIZE="2" FACE=VERDANA>Cell
<TD><FONT COLOR="#FF3300" SIZE="2" FACE="VERDANA">Cell </TD>
<TD><FONT COLOR="#006600" SIZE="2" FACE="VERDANA>Cell </TD>
<TD><FONT COLOR="#009900" SIZE="2" FACE="VERDANA">Cell </TD>
</TR>
</Table></CENTER>

Cell Cell Cell
Cell Cell Cell

Cellspacing - This will allow you to set the spacing between the table cells.
 
<CENTER><TABLE BORDER="1" CELLSPACING=10> <TR> <TD><FONT  COLOR="#FFFF00" SIZE="2" FACE=VERDANA>Cell
<TD><FONT COLOR="#FF3300" SIZE="2" FACE="VERDANA">Cell </TD>
<TD><FONT COLOR="#006600" SIZE="2" FACE="VERDANA>Cell </TD>
<TD><FONT COLOR="#009900" SIZE="2" FACE="VERDANA">Cell </TD>
</TR>
</Table></CENTER>

Cellpadding=10
Cell Cell Cell Cell
Cell Cell Cell Cell

Cellpadding=4
Cell Cell Cell Cell
Cell Cell Cell Cell