86 lines
1.6 KiB
HTML
Executable File
86 lines
1.6 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Challenge B</title>
|
|
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
|
|
<script
|
|
src="https://code.jquery.com/jquery-3.2.1.js"
|
|
integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
|
|
crossorigin="anonymous"></script>
|
|
<style>
|
|
td, th {
|
|
width: 5rem;
|
|
height: 2rem;
|
|
border: 1px solid #ccc;
|
|
text-align: center;
|
|
}
|
|
th {
|
|
background: lightblue;
|
|
border-color: white;
|
|
}
|
|
body {
|
|
padding: 1rem;
|
|
font-family: Roboto;
|
|
}
|
|
/*class to be added to jquery function to change row colors*/
|
|
.selection{
|
|
background-color: #c65353;
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
<body>
|
|
<!--create a table-->
|
|
<table>
|
|
<tr>
|
|
<th></th>
|
|
<th>Country</th>
|
|
<th>Price</th>
|
|
<th>Nutrition</th>
|
|
<th>Category</th>
|
|
</tr>
|
|
<tr>
|
|
<th>Spinach</th>
|
|
<td>America</td>
|
|
<td>28</td>
|
|
<td>90</td>
|
|
<td>Veg</td>
|
|
</tr>
|
|
<tr>
|
|
<th>Carrots</th>
|
|
<td>France</td>
|
|
<td>56</td>
|
|
<td>75</td>
|
|
<td>Veg</td>
|
|
</tr>
|
|
<tr>
|
|
<th>Broccoli</th>
|
|
<td>Bulgaria</td>
|
|
<td>12</td>
|
|
<td>70</td>
|
|
<td>Veg</td>
|
|
</tr>
|
|
<tr>
|
|
<th>Orange</th>
|
|
<td>Morocco</td>
|
|
<td>15</td>
|
|
<td>50</td>
|
|
<td>Fruit</td>
|
|
</tr>
|
|
<tr>
|
|
<th>Tangerine</th>
|
|
<td>Cyprus</td>
|
|
<td>12</td>
|
|
<td>25</td>
|
|
<td>Fruit</td>
|
|
</tr>
|
|
</table>
|
|
<!--add your own jquery files here-->
|
|
<script src="js/script.js"></script>
|
|
</body>
|
|
</html> |