Chaitanya134/index.html

## index.html
<!DOCTYPE html>
<html>
  <head>
    <title>HTML tables</title>
    <link href="styles.css" type="text/css" rel="stylesheet">
  </head>
  <body>
    <h1>HTML Table Reference</h1>
    <h2>Table Tags</h2>
    <table>
      <thead>
        <tr>
          <th>Tag</th>
          <th>Name</th>
          <th>Description</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>&lt;table&gt;</th>
          <td>Table</td>
          <td>The wrapper element for all HTML tables.</td>
        </tr>
        <tr>
          <th>&lt;thead&gt;</th>
          <td>Table Head</td>
          <td>The set of rows defning the column headers in a table.</td>
        </tr>
        <tr>
          <th>&lt;tbody&gt;</th>
          <td>Table Body</td>
          <td>The set of rows containing actual table data.</td>
        </tr>
        <tr>
          <th>&lt;tr&gt;</th>
          <td>Table Row</td>
          <td>The table row container.</td>
        </tr>
        <tr>
          <th>&lt;td&gt;</th>
          <td>Table Data</td>
          <td>The table row container.</td>
        </tr>
        <tr>
          <th>&lt;tfoot&gt;</th>
          <td>Table Foot</td>
          <td>The set of rows defining the footer in a table.</td>
        </tr>
      </tbody>
    </table>
    <h2>Table Attributes</h2>
    <table>
      <thead>
        <tr>
          <th>Attribute</th>
          <th>Name</th>
          <th>Description</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>&lt;colspan&gt;</th>
          <td>Column Span</td>
          <td>Defines how many columns a td element should span.</td>
        </tr>
        <tr>
          <th>&lt;rowspan&gt;</th>
          <td>Row Span</td>
          <td>Defines how many rows a td element should span.</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>

## styles.css
body {
  text-align: center;
  background-color: Gainsboro;
}

th {
  background-color: Plum;
}

tbody th {
  background-color: LightYellow;
  border-top: 1px solid RebeccaPurple;
  font-weight: 25;
}

table {
  border: 2px solid RebeccaPurple;
  margin-left: auto;
  margin-right: auto;
}

td {
  border-top: 1px solid RebeccaPurple;
}

td {
  text-align: left;
}

h2 {
  color: RebeccaPurple;
}
	<!DOCTYPE html>
	<html>
	<head>
	<title>HTML tables</title>
	<link href="styles.css" type="text/css" rel="stylesheet">
	</head>
	<body>
	<h1>HTML Table Reference</h1>
	<h2>Table Tags</h2>
	<table>
	<thead>
	<tr>
	<th>Tag</th>
	<th>Name</th>
	<th>Description</th>
	</tr>
	</thead>
	<tbody>
	<tr>
	<th><table></th>
	<td>Table</td>
	<td>The wrapper element for all HTML tables.</td>
	</tr>
	<tr>
	<th><thead></th>
	<td>Table Head</td>
	<td>The set of rows defning the column headers in a table.</td>
	</tr>
	<tr>
	<th><tbody></th>
	<td>Table Body</td>
	<td>The set of rows containing actual table data.</td>
	</tr>
	<tr>
	<th><tr></th>
	<td>Table Row</td>
	<td>The table row container.</td>
	</tr>
	<tr>
	<th><td></th>
	<td>Table Data</td>
	<td>The table row container.</td>
	</tr>
	<tr>
	<th><tfoot></th>
	<td>Table Foot</td>
	<td>The set of rows defining the footer in a table.</td>
	</tr>
	</tbody>
	</table>
	<h2>Table Attributes</h2>
	<table>
	<thead>
	<tr>
	<th>Attribute</th>
	<th>Name</th>
	<th>Description</th>
	</tr>
	</thead>
	<tbody>
	<tr>
	<th><colspan></th>
	<td>Column Span</td>
	<td>Defines how many columns a td element should span.</td>
	</tr>
	<tr>
	<th><rowspan></th>
	<td>Row Span</td>
	<td>Defines how many rows a td element should span.</td>
	</tr>
	</tbody>
	</table>
	</body>
	</html>
	body {
	text-align: center;
	background-color: Gainsboro;
	}

	th {
	background-color: Plum;
	}

	tbody th {
	background-color: LightYellow;
	border-top: 1px solid RebeccaPurple;
	font-weight: 25;
	}

	table {
	border: 2px solid RebeccaPurple;
	margin-left: auto;
	margin-right: auto;
	}

	td {
	border-top: 1px solid RebeccaPurple;
	}

	td {
	text-align: left;
	}

	h2 {
	color: RebeccaPurple;
	}