Can I Color Table Columns Using CSS Without Coloring Individual Cells?

Is there a way to color spans of columns all the way down. See, starting example below:

<table border="1"> <tr> <th>Motor</th> <th colspan="3">Engine</th> <th>Car</th> <th colspan="2">Body</th> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> </tr> <tr> <td>7</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> </tr> </table>

And I am looking for a better way (less code, non-individual coloring) to color, for example, "Engine" and "Body" spans, including all the cells underneath them in #DDD

<style> .color { background-color: #DDD } </style> <table border="1"> <tr> <th>Motor</th> <th colspan="3" class="color">Engine</th> <th>Car</th> <th colspan="2" class="color">Body</th> </tr> <tr> <td>1</td> <td class="color">2</td> <td class="color">3</td> <td class="color">4</td> <td>5</td> <td class="color">6</td> <td class="color">7</td> </tr> <tr> <td>7</td> <td class="color">1</td> <td class="color">2</td> <td class="color">3</td> <td>4</td> <td class="color">5</td> <td class="color">6</td> </tr> </table>

Từ khóa » Html Table Set Column Background Color