row-group-order-ref.html (1026B)
1 <!doctype html> 2 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 3 <style> 4 table { 5 font: 8px Ahem; 6 border-collapse: collapse; 7 } 8 thead, tbody, tfoot { 9 border: 10px solid; 10 } 11 .first { 12 border-color: green; 13 } 14 .second { 15 border-color: blue; 16 } 17 .third { 18 border-color: yellow; 19 } 20 tbody { 21 border-color: orange; 22 } 23 td { 24 width: 50px; 25 height: 50px; 26 } 27 </style> 28 29 <table> 30 <tbody class="first"> 31 <tr><td>head 1</td></tr> 32 </tbody> 33 <tbody> 34 <tr><td>body 1</td></tr> 35 </tbody> 36 <tbody class="second"> 37 <tr><td>head 2</td></tr> 38 </tbody> 39 <tbody> 40 <tr><td>body 2</td></tr> 41 </tbody> 42 <tbody class="third"> 43 <tr><td>head 3</td></tr> 44 </tbody> 45 <tbody> 46 <tr><td>body 3</td></tr> 47 </tbody> 48 <tbody class="second"> 49 <tr><td>foot 2</td></tr> 50 </tbody> 51 <tbody> 52 <tr><td>body 4</td></tr> 53 </tbody> 54 <tbody class="third"> 55 <tr><td>foot 3</td></tr> 56 </tbody> 57 <tbody class="first"> 58 <tr><td>foot 1</td></tr> 59 </tbody> 60 </table>