braindude
asked on
quick table help
I need someone to point me to some info or show me some info on the laydown of tables. What <tr> is for. What <td> is for. What they would be used for. How to use them. Any information along those lines would be helpful and appreciated. Thanks!
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
@hongjun: W3C specs are far from beeing a useful "handout" for a novice :-)
CirTap
CirTap
Try this help site - it is very clearly written and easy to use:
http://www.htmlhelp.com/reference/html40/tables/
Hope this helps
MM
http://www.htmlhelp.com/reference/html40/tables/
Hope this helps
MM
Hmm, I originally learned tables from Annabella's site.
It may not be the most technical introduction to tables/HTML, but she has a knack for explaining things to HTML newbies VERY well - and we were all new once!
Not to mention I thanked her a few months ago for introducing me to HTML and programming, and she sent me a very nice reply. :-)
If you go there, give the points to honguin, since he suggested it first.
http://www.annabella.net/html.html
I would also check out the following sites, once you're done with hers:
http://www.htmlgoodies.com
http://www.webmonkey.com
Once you're through with those you should be able to create almost anything using tables.
It may not be the most technical introduction to tables/HTML, but she has a knack for explaining things to HTML newbies VERY well - and we were all new once!
Not to mention I thanked her a few months ago for introducing me to HTML and programming, and she sent me a very nice reply. :-)
If you go there, give the points to honguin, since he suggested it first.
http://www.annabella.net/html.html
I would also check out the following sites, once you're done with hers:
http://www.htmlgoodies.com
http://www.webmonkey.com
Once you're through with those you should be able to create almost anything using tables.
http://www.htmlgoodies.com/tutors/tbl.html
it has everything you could ever want to know about tables and all the little meanings of <tr> ect...
it has everything you could ever want to know about tables and all the little meanings of <tr> ect...
<table> starts the table.
<tr>, which is nested inside <table>, starts a table row.
<td>, which is nested inside <tr>, is where the content starts. basically, this is the "table cell."
<tr>, which is nested inside <table>, starts a table row.
<td>, which is nested inside <tr>, is where the content starts. basically, this is the "table cell."
so
<table>
<tr>
<td>1-1</td><td>1-2</td><t
<tr>
<tr>
<td>2-1</td><td>2-2</td><t
<tr>
<tr>
<td>3-1</td><td>3-2</td><t
<tr>
</table>
creates a 3 row, 3 column table. I put x-y to symbolize
x=row and y=column.
<table>
<tr>
<td>1-1</td><td>1-2</td><t
<tr>
<tr>
<td>2-1</td><td>2-2</td><t
<tr>
<tr>
<td>3-1</td><td>3-2</td><t
<tr>
</table>
creates a 3 row, 3 column table. I put x-y to symbolize
x=row and y=column.
If you're going to explain it with an example, you left out colspan and rowspan. ;-)
<html>
<head>
<title>Table</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td>1</td><td>2</td><td>3<
</tr>
<tr>
<td colspan="2">2 columns</td><td colspan="3">3 columns</td>
</tr>
<tr>
<td colspan="4">4 columns</td><td rowspan="2">1 column, 2 ROWS</td>
</tr>
<tr>
<td colspan="4">4 columns</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Table</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td>1</td><td>2</td><td>3<
</tr>
<tr>
<td colspan="2">2 columns</td><td colspan="3">3 columns</td>
</tr>
<tr>
<td colspan="4">4 columns</td><td rowspan="2">1 column, 2 ROWS</td>
</tr>
<tr>
<td colspan="4">4 columns</td>
</tr>
</table>
</body>
</html>
A bit better formatted example... just to give an idea of how to format tables:
<html>
<head>
<title>Table</title>
<style type="text/css">
<!--
td {
text-align:center
}
-->
</style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td width="50">1</td><td width="50">2</td><td width="50">3</td><td width="50">4</td><td width="50">5</td>
</tr>
<tr>
<td colspan="2" width="100">2 columns</td><td colspan="3" width="150">3 columns</td>
</tr>
<tr>
<td colspan="4" width="200">4 columns</td><td rowspan="2" width="50">1 column, 2 rows</td>
</tr>
<tr>
<td colspan="4" width="200">4 columns</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Table</title>
<style type="text/css">
<!--
td {
text-align:center
}
-->
</style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td width="50">1</td><td width="50">2</td><td width="50">3</td><td width="50">4</td><td width="50">5</td>
</tr>
<tr>
<td colspan="2" width="100">2 columns</td><td colspan="3" width="150">3 columns</td>
</tr>
<tr>
<td colspan="4" width="200">4 columns</td><td rowspan="2" width="50">1 column, 2 rows</td>
</tr>
<tr>
<td colspan="4" width="200">4 columns</td>
</tr>
</table>
</body>
</html>
I left rowspan and colspan out on purpose, because i didn't want to confuse, since the question asked for "what is it used for"... but i'm glad someone had the courage to post them.
on a side note, i personally wouldn't use rowspan. its just a lot harder to conceptualize as a beginner, and most browsers now are fast enough where it won't make a difference. instead, use nested tables for better readability in your code.
the exception is netscape 4.x, where if you nest too many tables, it will crash because netscape is a peice of ****. i recently got it to crash with 9 nested tables, on a p3 800 Mhz, 128 Mb ram... IE 4+ displayed it in seconds while netscape crashed the computer.
I haven't tested the same code on NS6+, but similar code in that browser seems ok.
on a side note, i personally wouldn't use rowspan. its just a lot harder to conceptualize as a beginner, and most browsers now are fast enough where it won't make a difference. instead, use nested tables for better readability in your code.
the exception is netscape 4.x, where if you nest too many tables, it will crash because netscape is a peice of ****. i recently got it to crash with 9 nested tables, on a p3 800 Mhz, 128 Mb ram... IE 4+ displayed it in seconds while netscape crashed the computer.
I haven't tested the same code on NS6+, but similar code in that browser seems ok.
lol @ your comments on ns 4.x.
I figure with a name like "braindude" the posted will take it upon himself to try and understand what we posted, therefore my use of colspan/rowspan, as that definitely explains columns and rows a bit more clearly - to me, anyway.
I don't see anything complicated about it, especially if you look at the simple example (probably better than what htmlgoodies uses, I learned HTML there originally though).
Regarding NS 4.x - 9 nested tables seems a bit much - but of course NS 4.x does "stink".
I would assume at this point that anyone suffering through the plethora of errors (presumably almost everywhere they go on the 'net) using NS 4.x would have the common sense to upgrade their browser. ;)
I figure with a name like "braindude" the posted will take it upon himself to try and understand what we posted, therefore my use of colspan/rowspan, as that definitely explains columns and rows a bit more clearly - to me, anyway.
I don't see anything complicated about it, especially if you look at the simple example (probably better than what htmlgoodies uses, I learned HTML there originally though).
Regarding NS 4.x - 9 nested tables seems a bit much - but of course NS 4.x does "stink".
I would assume at this point that anyone suffering through the plethora of errors (presumably almost everywhere they go on the 'net) using NS 4.x would have the common sense to upgrade their browser. ;)
ASKER
Whew!! Talk about a response. And about my name... lets just leave it at that ;) Who ever posted an answer will get 75 points because you all had something good to add in. Thanks for all of the help!
ASKER
I posted all of the points under Web Languages so you can get them there.
https://www.experts-exchange.com/questions/20545678/For-rajivraj164.html - Points for rajivraj164
https://www.experts-exchange.com/questions/20545683/For-jwduke3d.html - Points for jwduke3d
?
Too late the question has been deleted
As you leanrn, you can use this link to try it out!