Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@Dre2124
Created March 23, 2023 02:52
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 Dre2124/fa316223aa50afb8ba7b1957c62ab85c to your computer and use it in GitHub Desktop.
Save Dre2124/fa316223aa50afb8ba7b1957c62ab85c to your computer and use it in GitHub Desktop.
Codecademy project- Table
<!DOCTYPE html>
<html>
<link href='./styles.css' rel='stylesheet'>
<head>
<title> My CheatSheet </title>
<body>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Alkatra&display=swap" rel="stylesheet">
<div>
<header class='cheat'> My Cheat Sheet </header>
</div>
<h1 class='table'> Table </h1>
<div>
<table>
<thead>
<tr>
<th> Tag </th>
<th> Description </th>
</tr>
</thead>
<tbody>
<tr>
<td class="line">&lt;table&gt;</td>
<td> Creates a table. </td>
</tr>
<tr>
<td class="line">&lt;thead&gt;</td>
<td> To section column headings </td>
</tr>
<tr>
<td class="line">&lt;tfoot&gt;</td>
<td> To section the bottom using a footer.</td>
</tr>
<tr>
<td class="line">&lt;tr&gt;</td>
<td> To add rows. </td>
</tr>
<tr>
<td class="line">&lt;td&gt;</td>
<td> To define cells. Table data </td>
</tr>
<tr>
<td class="line">&lt;tbody&gt;</td>
<td> To section off long tables </td>
</tr>
</tbody>
</table>
</div>
<div>
<h1 class='table2'> Table 2 </h1>
</div>
<div>
<table>
<thead>
<tr>
<th> Attribute </th>
<th> Description </th>
</tr>
</thead>
<tbody>
<tr>
<td class="line">&lt;colspan&gt;</td>
<td> Denotes the number of columns td elements span across. </td>
</tr>
<tr>
<td class="line">&lt;rowspan&gt;</td>
<td> Denotes the number of rows td elements span across. </td>
</tr>
</tbody>
</table>
</div>
</body>
</head>
</html>
body
{
background-color: grey;
}
.table
{
text-align: center;
color: white;
font-family: 'Alkatra', cursive;
}
.cheat {
font-size: 20px;
font-family: "Times New Roman";
text-align: center;
font-weight: bold;
background-color: aquamarine;
}
table {
text-align: center;
border: 1px solid black;
font-family: Arial, serif;
table-layout: auto;
width: 412px;
height: auto;
color: black;
font-size: 13px;
}
th {
background-color: orange;
color: black;
font-size: 13px;
font-family: Georgia
}
.line
{
background-color: white;
font-family: Helvetica;
font-weight: bolder;
}
td {
background-color: yellow;
}
.table2
{
text-align: center;
color: white;
font-family: 'Alkatra', cursive;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment