Developing Webs logo
Google
Web DW-Main DW-Photoshop
Visit the message board for solutions or post a question Check out the Classes offered for free at Developing Webs Voice Chat submit a tutorial, resources, article, font for publication consideration and earn a one way link back to your site Get more specifics about the Developing Webs Voice chat room and its room members View the current news at Developing Webs alternative sites which are resources for your d3evelopment needs Join Developing Webs Chat Link to us on your web page to help support this resource! Check out Developing Webs At yahoo groups! Developing Webs Home Adobe Photoshop Tutorials Macromedia Flash Tutorials Jasc Paint Shop Pro Tutorials Adobe Illustrator Animation basics Some Basic PHP tutorials Perl Tutorials HTML Tutorials Cascading Style Sheets javascript Front Page Tutorials Macromedia Dream Weaver Tutorials dreamweaver Publishing your site, FTP, ChMod, Promotions
RSS Newsfeed
for your site
DW News
Calendar
DW Forum
Right click on button and copy shortcut

Add to My Yahoo!

Reminder
Remember to book mark this site!



Request a Tutorial

Writing HTML Code for Tables 2

There are many attributes of a table that can be used to make your table look the way you want. Complete listing of attributes can be found under the html code listings for <TABLE>, <TR>, <TD>; HEX values can be found on this Hexidecimal color chart

This is an example of how a table is layed out. IT will look like this:

cell 1  

cell2

 

cell 3

 

 

cell4

 

Meaning of tags. Tags
The Table Tag <TABLE> tells the browser to start the table.  
  • Aligned center put the table in the middle of the page (Left to right)
  • border is the size of the border around the table set to 6 pixels.
  •  Cellpadding, or the space just inside the cell has been set at 5 pixels
  • Cellspacing is set to 5 pixels which separates the border around the cells from each other and the outside.
  • Width is the total width of the table set at 500 Pixels.
  • Bordercolor can be set to a hexidecimal.
<TABLE align="center" border="6" cellpadding="5" cellspacing="5" width="500" bordercolor="#D2F0FF">
The table row tag <TR> tells the browser that a new row is started. <TR>
The table data cell tag <TD> tells the browser that there is a cell. The TD tag is the only place that data can be put in a table.
  • Width is set to 50% of the table
  • Background color <bgcolor> is set using Hexidecimal
  • Border color <bordercolor> is set in hex.
<td width="75%" bgcolor="#336699" bordercolor="#336699">
The contents of the data cell is placed between the start of the table data cell tag <TD> and the close of it. </TD> cell 1
The browser interprets this as the close of the Table Data Cell </TD>
Start of a new cell
  • Width is set to 50%
  • Background image <background> is set to tile an image
 <td width="75%" background=
"../flash/images/wood090.jpg">
cell contents <P></P><P>cell2 </P> <P></P>
Close of the data cell </TD>
The browser interprets the end of the row tag </TR> as the end of that row in the table. </TR>
Start of a row <TR>
start of a data cell
  • No special sttributes are set for this cell
  •  inherits width from cells in same column.
  • inherits the background color and bordercolor from the table attributes
<td>
cell contents cell 3
end of a data cell </TD>
start of a data cell
  • width is inherited from other cells
  • background color is set in hex
  • Bordercolor is set in hex
<td bgcolor="#808080" bordercolor="#0000FF">
cell contents cell 4
end of a data cell </TD>
end of the table row </TR>
End of the table </TABLE> </TABLE>
   

 

Continue to TABLE WRITING 3



"Building The Web Into a Nicer Place -- One Site At A Time"
Developing Webs Group Copyright © 2001-2024 All Rights Reserved
Privacy and Legal