Cheat Sheet

Page Basics

HTML :

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!--Build your page within these tags-->
</body>
</html>

Tables

HTML :

<table>
<thead>
<tr>
<th>Month</th>
<th>Total Sales</th>
<th>Expenses</th>
<th>Remaining Profit</th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>$1,200.00</td>
<td>$400.00</td>
<td>$800.00</td>
</tr>
<tr>
<td>February</td>
<td>$1,100.00</td>
<td>$200.00</td>
<td>$900.00</td>
</tr>
<tr>
<td>March</td>
<td>$1,300.00</td>
<td>$800.00</td>
<td>$500.00</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Quarterly Totals:</td>
<td>$3,600.00</td>
<td>$1,400.00</td>
<td>$2,300.00</td>
</tr>
</tfoot>
</table>

CSS :

table {
width: 300px;
margin: auto;
}

td, th {
background-color: lightgrey;
width: 25%;
text-align: center;
}

Output:

Month Total Sales Expenses Remaining Profit
January $1,200.00 $400.00 $800.00
February $1,100.00 $200.00 $900.00
March $1,300.00 $800.00 $500.00
Quarterly Totals: $3,600.00 $1,400.00 $2,300.00