google.com, pub-4617457846989927, DIRECT, f08c47fec0942fa0 Learn to enjoy every minute of your life.Only I can change my life.: Tables in HTML

Monday, July 1, 2013

Tables in HTML

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:-
Marks of Students
Roll No. Name Marks
Paper IPaper II
101ABC7585
102XYZ7787
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-
Vijay Marwaha
<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>

No comments:

Post a Comment

अच्छे विचार करे विचार

  पहचान की नुमाईश, जरा कम करें... जहाँ भी "मैं" लिखा है, उसे "हम" करें... हमारी "इच्छाओं" से ज़्यादा "सुन...