Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Cheat Sheet
<!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>
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;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.