Forked from glenda drew's Pen target practice complete.
A Pen by Spencer Mathews on CodePen.
<table id="choc"> | |
<tr> | |
<th colspan='2'>chocolate</th> | |
</tr> | |
<tr> | |
<td>extra dark</td> | |
<td>ecstatic</td> | |
</tr> | |
<tr> | |
<td>very dark</td> | |
<td>very happy</td> | |
</tr> | |
<tr> | |
<td>dark</td> | |
<td>happy</td> | |
</tr> | |
<!--add two more table rows with table data of more types of chocolate--> | |
<tr> | |
<td>white</td> | |
<td>sweet</td> | |
<tr> | |
</table> |
//call to jQuery ready function that checks whether or not the browser is | |
//ready to load the page | |
$(document).ready(function() { | |
//send a message to the console window to check | |
//if this page is geting read | |
console.log("ready"); | |
//custom js goes here | |
//add code to change the body background | |
//js filters include :even and :odd | |
$('#choc tr:even').css('backgroundColor', '#eee'); | |
// add a filter that changes something in the css for the odd tr's | |
//close jQuery | |
}); |
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> |
* { | |
margin: 0px; | |
padding: 0px; | |
} | |
body { | |
font-family: Verdana; | |
color: #222; | |
} | |
table#choc { | |
width: 5in; | |
margin: 1in auto 0px auto; | |
color: #420808; | |
border-bottom: 1px solid #eee; | |
border-right: 1px solid #eee; | |
} | |
table#choc tr { | |
padding: 7px; | |
} | |
table#choc td, | |
table#choc th { | |
height: .5in; | |
padding-left: 25px; | |
border-left: 1px solid #eee; | |
} | |
table#choc th { | |
text-align: left; | |
font-size: 36px; | |
padding: 24px; | |
} |
Forked from glenda drew's Pen target practice complete.
A Pen by Spencer Mathews on CodePen.