How to design(Draw) Bar-chart in html with student marks
with output
<html>
<head>
<title>Bar Chart</title>
</head>
<body bgcolor=lightblue>
<h1 align=center ><u>Bar-Chart</u></h1><br>
<h3 align=center ><u>Student passed</u></h1>
<table align=center>
<tr>
<td height=10 width="20" >90%</td>
<td rowspan=6 height=10 width="20" bgcolor=aabbcc></td>
</tr>
<tr>
<td height=10 width="20" >80%</td>
<td rowspan=5 height=10 width="20" bgcolor=bbaacc></td>
</tr>
<tr><td height=10 width="20">70%</td>
<td rowspan=4 height=10 width="20" bgcolor=ddccaa></td>
</tr>
<tr><td height=10 width="20">60%</td>
<td rowspan=3 height=10 width="20" bgcolor=aaffaa></td>
</tr>
<tr><td height=10 width="20">50%</td>
<td rowspan=2 height=10 width="20" bgcolor=ffooff></td>
</tr>
<tr><td height=10 width="20">35%</td>
<td rowspan=1 height=10 width="20" bgcolor=aabbcc></td>
</tr>
<tr>
<td>0</td>
<td>Asp.Net</td>
<td>Sql Server</td>
<td>Data structure</td>
<td>C++</td>
<td>Operating System</td>
<td>C language</td>
</tr>
</table>
</body>
</html>
with output
<html>
<head>
<title>Bar Chart</title>
</head>
<body bgcolor=lightblue>
<h1 align=center ><u>Bar-Chart</u></h1><br>
<h3 align=center ><u>Student passed</u></h1>
<table align=center>
<tr>
<td height=10 width="20" >90%</td>
<td rowspan=6 height=10 width="20" bgcolor=aabbcc></td>
</tr>
<tr>
<td height=10 width="20" >80%</td>
<td rowspan=5 height=10 width="20" bgcolor=bbaacc></td>
</tr>
<tr><td height=10 width="20">70%</td>
<td rowspan=4 height=10 width="20" bgcolor=ddccaa></td>
</tr>
<tr><td height=10 width="20">60%</td>
<td rowspan=3 height=10 width="20" bgcolor=aaffaa></td>
</tr>
<tr><td height=10 width="20">50%</td>
<td rowspan=2 height=10 width="20" bgcolor=ffooff></td>
</tr>
<tr><td height=10 width="20">35%</td>
<td rowspan=1 height=10 width="20" bgcolor=aabbcc></td>
</tr>
<tr>
<td>0</td>
<td>Asp.Net</td>
<td>Sql Server</td>
<td>Data structure</td>
<td>C++</td>
<td>Operating System</td>
<td>C language</td>
</tr>
</table>
</body>
</html>
0 comments: