Table in HTML :-
table.html:-
<!DOCTYPE html>
<html>
<body>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 15px;
}
th, caption {
text-align: center;
}
table {
border-spacing: 15px;
}
th {
background-color: lightpink;
}
</style> <br/><br/><br/><br/><br/>
<center> <caption><h1>Student Details</h1></caption></center>
<table border="1" style="width:100%">
<tr>
<th>First Name</th>
<th>Last Name</th>
<th colspan="2">Marks(1st and 2nd)</th>
</tr>
<tr>
<td>Jack</td>
<td>Roy</td>
<td>75</td>
<td>60</td>
</tr>
<tr>
<td>Everson</td>
<td>Mahabala</td>
<td>83</td>
<td>75</td>
</tr>
<tr>
<td>Rosy</td>
<td>Rajput</td>
<td>90</td>
<td>85</td>
</tr>
</table>
</body>
</html>
Screenshot:-
- Let me discuss it with a suitable example:-
table.html:-
<!DOCTYPE html>
<html>
<body>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 15px;
}
th, caption {
text-align: center;
}
table {
border-spacing: 15px;
}
th {
background-color: lightpink;
}
</style> <br/><br/><br/><br/><br/>
<center> <caption><h1>Student Details</h1></caption></center>
<table border="1" style="width:100%">
<tr>
<th>First Name</th>
<th>Last Name</th>
<th colspan="2">Marks(1st and 2nd)</th>
</tr>
<tr>
<td>Jack</td>
<td>Roy</td>
<td>75</td>
<td>60</td>
</tr>
<tr>
<td>Everson</td>
<td>Mahabala</td>
<td>83</td>
<td>75</td>
</tr>
<tr>
<td>Rosy</td>
<td>Rajput</td>
<td>90</td>
<td>85</td>
</tr>
</table>
</body>
</html>
Screenshot:-
Description:-
The "table" is one of the concept used in HTML language. It can be used in the HTML, by using "<table>" tag. It can be used when you want to represent any set of data in the web page in a tabular format. "<tr>", "<th>", "<td>" are the tags that are used under the opening and closing of table tag. "<th>" tag is used to declare any heading in the table, and will be displayed in bold. "<tr>" represents every row of the table and "<td>" represents the data in each row. In this example, I have added some CSS functionality to the HTML table, by using "<style>" tag.
