Source of HierarchicalCss.htm

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Using CSS hierarchical selectors</title>
<style>
TABLE.printout TD, TABLE.printout TH {
  font-size: 10pt; font-family: Verdana; 
  padding-left:8px; padding-right:8px;
  padding-top: 2pt; padding-bottom: 2pt; 
  border-width: 2px; border-right-style: solid; }
 
.tLast { border-right-style: none !important; }
 
TABLE.printout TH { border-bottom-style: solid; }
 
TABLE.printout TD.tColOne, 
TABLE.printout TD.tColTwo { text-align: left; }
TABLE.printout TD.tColThree { text-align: center; }
TABLE.printout TD.tColFour { text-align: right; }
TABLE.printout TR.tEvenRow { background-color: #C0C0C0; }
</style>
</head>
<body>
Text before the table
<table cellspacing="0" class="printout">
  <tr>
    <th>Header #1</th>
    <th>Header #2</th>
    <th>Header #3</th>
    <th class="tLast">Header #4</th>
  </tr>
  <tr>
    <td class="tColOne">Row #1, Col#1 
	... ...</td>
    <td class="tColTwo">Row #1, Col#2</td>
    <td class="tColThree">Row #1, Col#3</td>
    <td class="tColFour tLast">Row #1, Col#4</td>
  </tr>
  <tr class="tEvenRow">
    <td class="tColOne">Row #2, Col#1</td>
    <td class="tColTwo tLast">Row #2, Col#2 
	... ...</td>
    <td class="tColThree">Row #2, Col#3</td>
    <td class="tColFour tLast">Row #2, Col#4</td>
  </tr>
  <tr>
    <td class="tColOne">Row #3, Col#1</td>
    <td class="tColTwo">Row #3, Col#2</td>
    <td class="tColThree">
	... Row #3, Col#3 ...</td>
    <td class="tColFour tLast">	... ... Row #3, Col#4</td>
  </tr>
</table>
Text after the table
</body>
</html>