Skip to content

Instantly share code, notes, and snippets.

@codecademydev

codecademydev/index.html Secret

Created April 6, 2020 22:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save codecademydev/690027123e4a9f8ea589d8b7f42b5c16 to your computer and use it in GitHub Desktop.
Save codecademydev/690027123e4a9f8ea589d8b7f42b5c16 to your computer and use it in GitHub Desktop.
Download ZIP
Codecademy export
Raw
index.html
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css">
<title>My Cheat Sheet</title>
</head>
<body>
<header>
<h1>HTML Table Reference</h1>
<h2>Table Tags</h2>
</header>
<main>
<table>
<thead>
<tr>
<th>Tag</th>
<th>Name</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<span class="tags">&lt;table&gt;</span>
</td>
<td>Table</td>
<td>The wrapper element for all HTML tables</td>
</tr>
<tr>
<td>
<span class="tags">&lt;thead&gt;</span>
</td>
<td>Table Head</td>
<td>The set of rows defining the column headers in a table.</td>
</tr>
<tr>
<td>
<span class="tags">&lt;tbody&gt;</span>
</td>
<td>Table Body</td>
<td>The set of rows containing actual table data.</td>
</tr>
<tr>
<td>
<span class="tags">&lt;tr&gt;</span>
</td>
<td>Table Row</td>
<td>The table row container</td>
</tr>
<tr>
<td>
<span class="tags">&lt;td&gt;</span>
</td>
<td>Table Data</td>
<td>The table row container</td>
</tr>
<tr>
<td>
<span class="tags">&lt;tfoot&gt;</span>
</td>
<td>Table Foot</td>
<td>The set of rows defining the footer in a table.</td>
</tr>
</tbody>
</table>
</main>
<th></th>
<footer>
<h2>Table Attributes</h2>
<table>
<thead>
<tr>
<th>Attribute</th>
<th>Name</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<span class="tags">colspan</span>
</td>
<td>Column Span</td>
<td>Defines how many columns a td element should span.</td>
</tr>
<tr>
<td>
<span class="tags">rowspan</span>
</td>
<td>Row Span</td>
<td>Defines how many rows a td element should span.</td>
</tr>
</tbody>
</table>
</footer>
</body>
</html>
Raw
styles.css
body {
background-color: peachpuff;
font-style: normal;
font-family: sans-serif;
}
table {
display: table;
width: 65%;
margin: 0 auto;
border: 3px solid white;
}
header {
width: 65%;
margin: 0 auto;
text-align: center;
}
.tags {
background-color: white;
font-family: monospace;
}
h2 {
text-align: center;
color: purple;
}
thead {
display: table-header-group;
background-color: lightgray;
border: inherit;
font-size: 18px;
}
td {
border-top: 1px solid white;
display: table-cell;
white-space: normal;
font-weight: bold;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment