codecademydev/index.html Secret

## index.html
<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="styles.css">
<title>cheat sheet</title>
</head>
<body>
  <h2 class="header">Html cheat sheet</h2>
  <br><p class="intro">so my topics will be about</p>
  <ul>
    <li>HTML Tables</li>
    <li>Other HTML tags</li>
    <li>CSS selectors and specificity</li>
    <li>Common CSS properties</li>
    </ul>
    <p class="explination"> So you can think of html tags as the containers for whatever's inside them, for example this is an html tag</p>
    <ul>
      <li>
        &lt;this is a tag & whatever is inside it is an element&gt;
        </li>
      </ul>
      <p> naturally whatever is inside the tags identifys what it does so for example &lt;p&gt;
        writes a paragraph there's also the table tag which i will give you an example of</p>
        <table id="customers">
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Berglunds snabbköp</td>
    <td>Christina Berglund</td>
    <td>Sweden</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Königlich Essen</td>
    <td>Philip Cramer</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
  <tr>
    <td>North/South</td>
    <td>Simon Crowther</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Paris spécialités</td>
    <td>Marie Bertrand</td>
    <td>France</td>
  </tr>
</table>
<p>so heres a table i stole from <a href="https://www.w3schools.com/css/css_table.asp">w3schools.com</a></p>
</body>
</html>

## styles.css
.header{
  fontfamily: arial;
  text-align: center;
}

body{
  margin: 0px;
  padding: 0px;
  background: whitesmoke;
}
.intro{
  margin: 0px 0px 0px 20px;
  font-family: arial;
  text-decoration: underline;
}
li{
  list-style-type: none
}
ul{
  text-align: center;
}
.explination{
  text-align: center;
}
#customers {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}
	<!DOCTYPE html>
	<html>
	<head>
	<link rel="stylesheet" href="styles.css">
	<title>cheat sheet</title>
	</head>
	<body>
	<h2 class="header">Html cheat sheet</h2>
	<br><p class="intro">so my topics will be about</p>
	<ul>
	<li>HTML Tables</li>
	<li>Other HTML tags</li>
	<li>CSS selectors and specificity</li>
	<li>Common CSS properties</li>
	</ul>
	<p class="explination"> So you can think of html tags as the containers for whatever's inside them, for example this is an html tag</p>
	<ul>
	<li>
	<this is a tag & whatever is inside it is an element>
	</li>
	</ul>
	<p> naturally whatever is inside the tags identifys what it does so for example <p>
	writes a paragraph there's also the table tag which i will give you an example of</p>
	<table id="customers">
	<tr>
	<th>Company</th>
	<th>Contact</th>
	<th>Country</th>
	</tr>
	<tr>
	<td>Alfreds Futterkiste</td>
	<td>Maria Anders</td>
	<td>Germany</td>
	</tr>
	<tr>
	<td>Berglunds snabbköp</td>
	<td>Christina Berglund</td>
	<td>Sweden</td>
	</tr>
	<tr>
	<td>Centro comercial Moctezuma</td>
	<td>Francisco Chang</td>
	<td>Mexico</td>
	</tr>
	<tr>
	<td>Ernst Handel</td>
	<td>Roland Mendel</td>
	<td>Austria</td>
	</tr>
	<tr>
	<td>Island Trading</td>
	<td>Helen Bennett</td>
	<td>UK</td>
	</tr>
	<tr>
	<td>Königlich Essen</td>
	<td>Philip Cramer</td>
	<td>Germany</td>
	</tr>
	<tr>
	<td>Laughing Bacchus Winecellars</td>
	<td>Yoshi Tannamuri</td>
	<td>Canada</td>
	</tr>
	<tr>
	<td>Magazzini Alimentari Riuniti</td>
	<td>Giovanni Rovelli</td>
	<td>Italy</td>
	</tr>
	<tr>
	<td>North/South</td>
	<td>Simon Crowther</td>
	<td>UK</td>
	</tr>
	<tr>
	<td>Paris spécialités</td>
	<td>Marie Bertrand</td>
	<td>France</td>
	</tr>
	</table>
	<p>so heres a table i stole from <a href="https://www.w3schools.com/css/css_table.asp">w3schools.com</a></p>
	</body>
	</html>
	.header{
	fontfamily: arial;
	text-align: center;
	}

	body{
	margin: 0px;
	padding: 0px;
	background: whitesmoke;
	}
	.intro{
	margin: 0px 0px 0px 20px;
	font-family: arial;
	text-decoration: underline;
	}
	li{
	list-style-type: none
	}
	ul{
	text-align: center;
	}
	.explination{
	text-align: center;
	}
	#customers {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	width: 100%;
	}

	#customers td, #customers th {
	border: 1px solid #ddd;
	padding: 8px;
	}

	#customers tr:nth-child(even){background-color: #f2f2f2;}

	#customers tr:hover {background-color: #ddd;}

	#customers th {
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: left;
	background-color: #4CAF50;
	color: white;
	}