<!DOCTYPE html>
<html>
<head>
<title>Table Styling</title>
<style>
body { color:#000000;
background-color:#ffffff;
font-family:verdana, sans-serif;
font-size:12px;
}
h1 { margin: auto;
width:20%;
}
table {
/* border-collapse: collapse; */
border: 1px solid black;
}
caption { margin-left: auto;
margin-right: auto;
font-size: 16px
}
tr { height:25px
}
tr:nth-child(odd) { background-color: #D6EEEE; /* odd & even rows */
}
tr:hover { background-color: gray;
}
td:nth-child(even) { /* background-color: #D6EEEE; /* odd & even columns */
}
th { border-radius: 10px;
border: 1px solid black;
background-color: #c1c1c1;
width: 100px
}
td { font-weight: normal;
padding: 2px;
}
</style>
</head>
<body>
<h1>Table Styling</h1>
<br>
<table>
<caption><b>Fruits Choices</b></caption>
<tr><th>Fruit<th>Color<th>Size<th>Price per pound</tr>
<tr><td>Apple<td>Red<td>Medium<td>$1.99</tr>
<tr><td>Orange<td>Orange<td>Medium<td>$1.59</tr>
<tr><td>Grape<td>Green<td>Small<td>$2.59</tr>
<tr><td>Banana<td>Yellow<td>Medium<td>$.79</tr>
<tr><td>Water Mellon<td>Green<td>Large<td>$.69</tr>
</table>
</body>
</html>