HTML5 and CSS3, Second Edition

<th>Quantity</th>

<th>Total</th>

</tr>

<tr>

<td>Coffeemug</td>

<td>$10.00</td>

<td> 5 </td>

<td>$50.00</td>

</tr>

<tr>

<td>Poloshirt</td>

<td>$20.00</td>

<td> 5 </td>

<td>$100.00</td>

</tr>

<tr>

<td>Red stapler</td>

<td>$9.00</td>

<td> 4 </td>

<td>$36.00</td>

</tr>

<tr>

<tdcolspan="3">Subtotal</td>

<td>$186.00</td>

</tr>

<tr>

<tdcolspan="3">Shipping</td>

<td>$12.00</td>

</tr>

<tr>

<tdcolspan="3">TotalDue</td>

<td>$198.00</td>

</tr>

</table>

First, let’s get rid of the hideous default table border. Create a new file called

stylesheets/style.css and link it up:

css3_advanced_selectors/index.html

<linkrel="stylesheet"href="stylesheets/style.css">

css3_advanced_selectors/stylesheets/style.css

table{

border-collapse:collapse;

width:600px;

}

th, td{ border:none;}

Also, style the header by giving it a black background with white text.

Chapter 4. Styling Content and Interfaces • 70

Download from Wow! eBook <www.wowebook.com> report erratum • discuss