Building Tables

Building Tables

HTML defines a table with the named <table> tag,the table tag contains a number of table rows defined with the <tr> tag.Each table row can consist of a number of table data <td> or table header <th> tags.

Type the following code in your text editor.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Tables </title>
</head>
<body>
<h2>Building Tables </h2>
<table border="1">
<tr>
<th>Hero Name </th>
<th>Ability </th>
<th>Location </th>
</tr>
<tr>
<td>Tree man </td>
<td>Photosynthesis,super human </td>
<td>Nigeria </td>
</tr>
<tr>
<td>Mirroring </td>
<td>Sorak eyes,poisonous fangs,healing beauty </td>
<td>Indian </td>
</tr>
<tr>
<td>Inches </td>
<td>Classified </td>
<td>Nigeria </td>
</tr>
</table>
</body>
</html>

Rowspan And Colspan

Making items take up more than one cell is not a difficult task,the code below shows you how easily implement this:

Replace the code in your body tag with this:
<h2> Schedule </h2>
<table border="1">
<tr>
<th> </th>
<th>Monday </th>
<th>Tuesday </th>
<th>Wednesday </th>
<th>Thurdays </th>
<th>Friday </th>
</tr>
<tr>
<th>Morning </th>
<td> Java </td>
<td> Php </td>
<td> C </td>
<td> Css </td>
<td rowspan="2"> php </td>
</tr>
<tr>
<th>Afternoon </th>
<td colspan="3" > c </td>
<td > Java </td>
</tr>
<tr>
<th>Evening </th>
<td colspan="2" > java </td>
<td > Php </td>
<td > css </td>
<td > Watch Movie </td>
</tr>
</table>