Skip to content

Instantly share code, notes, and snippets.

@codecademydev codecademydev/index.html Secret

Created Jun 25, 2020
Embed
What would you like to do?
Codecademy export
<!DOCTYPE html>
<html>
<body>
<head>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300&display=swap" rel="stylesheet">
<link href="styles.css" rel="stylesheet" type="text/css">
<title>Essential Oil Diffusers</title>
</head>
<header>
<h1>Best Essential Oil Diffusers <br> on the Market</h1>
</header>
<main>
<p class="description">
In here you'll have a chart of the best Essential Oil Diffusers I have tried so far, ranging from price, quality, and overall satisfaction!
</p>
<table>
<tr>
<th>Link</th>
<th>Product Name</th>
<th>Price</th>
<th>Quality</th>
<th>Overall</th>
</tr>
<tr>
<td class="numero-1"><a href="https://www.amazon.com/Diffuser-Essential-Oils-400ml-Cleaning/dp/B074QH7DWM/ref=sr_1_27?dchild=1&keywords=essential+oil+diffuser&qid=1593121854&sr=8-27" target="_blank"><img src="https://images-na.ssl-images-amazon.com/images/I/41s1vMuqXfL.jpg"></a></td>
<td>Everlasting Comfort Diffuser for Essential Oils</td>
<td>$33.95</td>
<td>Great</td>
<td>Great <br> Satisfaction</td>
</tr>
<tr>
<td class="numero-2"><a href="https://www.amazon.com/ASAKUKI-Essential-Ultrasonic-Aromatherapy-Humidifier/dp/B01MR4Y0CZ/ref=sr_1_7?dchild=1&keywords=essential+oil+diffuser&qid=1593121854&sr=8-7" target="_blank"><img src="https://images-na.ssl-images-amazon.com/images/I/61-RDy%2BOF7L._SL1500_.jpg"></a></td>
<td>ASAKUKI 500ml Premium, Essential Oil Diffuser</td>
<td>$25.99</td>
<td>So-So <br> kind of an ugly shape</td>
<td>Alright <br> Satisfaction</td>
</tr>
<tr>
<td class="numero-3"><a href="https://www.amazon.com/Diffuserlove-Ultrasonic-Essential-Aromatherapy-Humidifiers/dp/B07WKCHH7D/ref=sr_1_25?dchild=1&keywords=essential+oil+diffuser&qid=1593121854&sr=8-25" target="_blank"><img src="https://images-na.ssl-images-amazon.com/images/I/71JqauvantL._AC_SL1327_.jpg"></a></td>
<td>Diffuserlove Ultrasonic Cool Mist Essential Oil Diffuser </td>
<td>$18.99</td>
<td>Sturdy</td>
<td>Dig the design <br> Satisfaction</td>
</tr>
<tr>
<td class="numero-4"><a href="https://www.amazon.com/URPOWER-Essential-Humidifier-Adjustable-Waterless/dp/B00Y2CQRZY/ref=sxin_9_sk-bs-v2-na_e887be59d9744950d4f15ac9151a536747add98b?cv_ct_cx=essential+oil+diffuser&dchild=1&keywords=essential+oil+diffuser&pd_rd_i=B00Y2CQRZY&pd_rd_r=ef9a3270-8e89-4546-b897-477472acf707&pd_rd_w=B7s8J&pd_rd_wg=ZOBZN&pf_rd_p=b645b828-1778-4255-896f-d398a7e9c026&pf_rd_r=JWHEGE7SJ5G445VX5FHP&qid=1593121854&sr=1-2-db39674d-a3a5-4ccf-88e3-f4fdf0022c7a" target="_blank"><img src="https://images-na.ssl-images-amazon.com/images/I/51TP9w3dgJL._SL1200_.jpg"></a></td>
<td>URPOWER 2nd Version Essential Oil Diffuser</td>
<td>$15.99</td>
<td>Feels Plasticky</td>
<td>Would not buy it<br> Too Ugly</td>
</tr>
</table>
</main>
<footer>
<p class="foot">Designed by: Percy Vasquez</p>
<p class="foot">Contact: percy-jackson@gmail.com</p>
<p class="foot">Address: Alexandria VA 22304</p>
</footer>
</body>
</html>
body {
font-family: 'Open Sans Condensed', sans-serif;
background-color: rgba(0, 181, 204, 0.15);
}
header {
text-align: center;
text-transform: uppercase;
background-image: url("https://i.pinimg.com/originals/f6/4c/c3/f64cc35ebe411b6cacff1317d68e7b33.jpg");
padding: 100px;
}
h1 {
padding: 10px;
background-color: rgba(0, 0, 0, 0.3);
color: white;
font-size: 50px;
}
.description {
text-align: center;
font-size: 30px;
padding: 40px 30px 0px;
}
table {
border-collapse: collapse;
margin: 80px 100px 100px;
}
table, td, th {
border: 1px solid black;
}
img {
height: 110px;
}
th {
font-size: 25px;
background-color: white;
}
td {
text-align: center;
padding: 20px;
font-size: 20px;
background-color: white;
}
footer {
text-align: center;
font-size: 18px;
width: 100%;
display: inline-block;
}
.foot {
width: 33%;
float: left;
height: 100%;
display: block;
}
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.