/ Published in: CSS
Table with style as in;
http://24ways.org/examples/tables-with-style/table_columns.html
http://24ways.org/examples/tables-with-style/table_columns.html
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>The Very Best Eggnog</title> <style type="text/css"> body { font: .8em "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; } ol { margin:0; padding: 0 1.5em; } table { color:#FFF; background:#C00; border-collapse:collapse; width:647px; border:5px solid #900; } thead { } thead th { padding:1em 1em .5em; border-bottom:1px dotted #FFF; font-size:120%; text-align:left; } thead tr { } td { padding:.5em 1em; } tbody tr.odd td { background:transparent url(tr_bg.png) repeat top left; } tfoot { } tfoot td { padding-bottom:1.5em; } tfoot tr { } * html tr.odd td { background:#C00; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='tr_bg.png', sizingMethod='scale'); } #middle { background-color:#900; } </style> </head> <body> <h1>The Very Best Eggnog</h1> <table> <col> <col id="middle"> <col> <thead> <tr><th>Ingredients</th><th>serves 12</th><th>serves 24</th></tr> </thead> <tfoot> <tr><td colspan="3"><ol> <li>Combine milk and spices including vanilla bean in a heavy saucepan and let them infuse over lowest possible heat for 5 minutes. Meanwhile, combine yolks and sugar in a large bowl and whisk until mixed.</li> <li>Bring milk to a boil and gradually whisk it into the yolk mixture. Return the mixture to the saucepan. Cook over medium heat, stirring steadily with a wooden spoon, for 2 to 3 minutes, or until foam subsides and mixture thickens to consistency of heavy cream. (Mixture should thickly coat the back of a wooden spoon.) Do not boil, or mixture will curdle.</li> <li>Strain mixture into a large bowl and let cool to room temperature. Stir in rum, brandy, half-and-half, vanilla and nutmeg.</li> <li>Refrigerate eggnog for at least 2 hours, preferably overnight. Just before serving, dust top of eggnog with additional nutmeg.</li> </ol></td></tr> </tfoot> <tbody> <tr><td>milk</td><td>1 quart</td><td>2 quart</td></tr> <tr class="odd"><td>cinnamon sticks</td><td>2</td><td>1</td></tr> <tr><td>vanilla bean, split</td><td>1</td><td>2</td></tr> <tr class="odd"><td>cloves</td><td>5</td><td>10</td></tr> <tr><td>mace</td><td>10 blades</td><td>20 blades</td></tr> <tr class="odd"><td>egg yolks</td><td>12</td><td>24</td></tr> <tr><td>cups sugar</td><td>1 ½ cups</td><td>3 cups</td></tr> <tr class="odd"><td>dark rum</td><td>1 ½ cups</td><td>3 cups</td></tr> <tr><td>brandy</td><td>1 ½ cups</td><td>3 cups</td></tr> <tr class="odd"><td>vanilla</td><td>1 tbsp</td><td>2 tbsp</td></tr> <tr><td>half-and-half or light cream</td><td>1 quart</td><td>2 quart</td></tr> <tr class="odd"><td>Freshly grated nutmeg to taste</td><td></td><td></td></tr> </tbody> </table> </body> </html>
URL: http://24ways.org/examples/tables-with-style/table_columns.html