The table tag defines a table.Inside the table tag ,of opening
<table> tag and closing </table> tag we use
<tr></tr> tag to define rows in a table ,use the
<th></th> tag to define row or column headings, and use the
<td></td> tag to define table cells.
The table tag can also contain a <caption </caption> tag,which specifies the caption for the table ,you can specify the width of border surrounding the table and default background color of the table.
Example:-
Html code to draw the above table is as:-
<html>
<head><title>Table tags</title></head>
<body>
<table border="1" cellpadding="10" cellspacing="5" align="center" bordercolor="maroon" bgcolor="silver">
<caption><span style="color: red; font-size: large;">Marks of Students</span></caption>
<tr>
<th bgcolor="skyblue" rowspan="2"><font color=#804000" SIZE="5">Roll No.</font></th>
<th bgcolor="skyblue" rowspan="2"><font color=#804000" SIZE="5">Name</font></th>
<th align="center" bgcolor="skyblue" colspan="2"><font color=#804000" SIZE="5">Marks</font></th>
</tr>
<tr>
<td bgcolor="lightblue"><font color=#FF8000" SIZE="5">Paper I</font></td>
<td bgcolor="lightblue"><font color=#FF8000" SIZE="5">Paper II</font></td>
</tr>
<tr>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">101</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">ABC</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">75</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">85</font></td>
</tr>
<tr>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">102</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">XYZ</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">77</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">87</font></td>
</tr>
</table>
</body>
</html>
Example 2:-
<html>
<body>
<style>
.circle{
width: 20px;
height: 20px;
border-radius: 50%;
background-color: blue
}
</style>
<TABLE width="50" height="50">
<TR >
<TD BGCOLOR="#FF8000" width="40px" height="20px"></TD>
</TR>
<TR>
<TD BGCOLOR="#FFFFFF" align="center" width="40px" height="20px"><div class="circle">
</div>
</TD>
</TR>
<TR>
<TD BGCOLOR="#088A08" width="40px" height="20px"></TD>
</TR>
</TABLE>
</body>
</html>
Example 3-
<HTML>
<BODY>
<TABLE BORDER="9" CELLPADDING="20" CELLSPACING="20" BGCOLOR="#8000FF">
<CAPTION ALIGN="BOTTOM">Vijay Marwaha</CAPTION> <TR>
<TD>
<TABLE BORDER="9" CELLPADDING="20" CELLSPACING="20" BGCOLOR=##00FFFF>
<TR>
<TD><img src="image1.gif" width="728" height="90" border="0" ALT="professional-in-computer"></TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
The table tag can also contain a <caption </caption> tag,which specifies the caption for the table ,you can specify the width of border surrounding the table and default background color of the table.
Example:-
| Roll No. | Name | Marks | |
|---|---|---|---|
| Paper I | Paper II | ||
| 101 | ABC | 75 | 85 |
| 102 | XYZ | 77 | 87 |
<html>
<head><title>Table tags</title></head>
<body>
<table border="1" cellpadding="10" cellspacing="5" align="center" bordercolor="maroon" bgcolor="silver">
<caption><span style="color: red; font-size: large;">Marks of Students</span></caption>
<tr>
<th bgcolor="skyblue" rowspan="2"><font color=#804000" SIZE="5">Roll No.</font></th>
<th bgcolor="skyblue" rowspan="2"><font color=#804000" SIZE="5">Name</font></th>
<th align="center" bgcolor="skyblue" colspan="2"><font color=#804000" SIZE="5">Marks</font></th>
</tr>
<tr>
<td bgcolor="lightblue"><font color=#FF8000" SIZE="5">Paper I</font></td>
<td bgcolor="lightblue"><font color=#FF8000" SIZE="5">Paper II</font></td>
</tr>
<tr>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">101</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">ABC</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">75</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">85</font></td>
</tr>
<tr>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">102</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">XYZ</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">77</font></td>
<td bgcolor="#C9F3FA"><font color=#804000" SIZE="5">87</font></td>
</tr>
</table>
</body>
</html>
Example 2:-
<body>
<style>
.circle{
width: 20px;
height: 20px;
border-radius: 50%;
background-color: blue
}
</style>
<TABLE width="50" height="50">
<TR >
<TD BGCOLOR="#FF8000" width="40px" height="20px"></TD>
</TR>
<TR>
<TD BGCOLOR="#FFFFFF" align="center" width="40px" height="20px"><div class="circle">
</div>
</TD>
</TR>
<TR>
<TD BGCOLOR="#088A08" width="40px" height="20px"></TD>
</TR>
</TABLE>
</body>
</html>
Example 3-
<BODY>
<TABLE BORDER="9" CELLPADDING="20" CELLSPACING="20" BGCOLOR="#8000FF">
<CAPTION ALIGN="BOTTOM">Vijay Marwaha</CAPTION> <TR>
<TD>
<TABLE BORDER="9" CELLPADDING="20" CELLSPACING="20" BGCOLOR=##00FFFF>
<TR>
<TD><img src="image1.gif" width="728" height="90" border="0" ALT="professional-in-computer"></TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
