Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Divide HTML table rows into labelled sections

Is there a valid way to divide a table's rows into sections, with a label identifying that section?

For example, something like the code below, but with a header or caption at the start of each TBODY (Looks like header/captions are only allowed at the top of a table)

<THEAD> <TR> <TH>Weekday</TH> <TH>Date</TH>  <TH>Manager</TH> </TR> </THEAD>  <TBODY> <TR> <TD>Monday</TD>    <TD>09/11/2000</TD> <TD>Kelsey</TD>  </TR> <TR> <TD>Tuesday</TD>   <TD>09/12/2000</TD> <TD>Lindsey</TD> </TR> <TR> <TD>Wednesday</TD> <TD>09/13/2000</TD> <TD>Randy</TD>   </TR> <TR> <TD>Thursday</TD>  <TD>09/14/2000</TD> <TD>Susan</TD>   </TR> <TR> <TD>Friday</TD>    <TD>09/15/2000</TD> <TD>Randy</TD>   </TR> <TR> <TD>Saturday</TD>  <TD>09/16/2000</TD> <TD>Lindsey</TD> </TR> <TR> <TD>Sunday</TD>    <TD>09/17/2000</TD> <TD>Susan</TD>   </TR> </TBODY>  <TBODY> <TR> <TD>Monday</TD>    <TD>09/18/2000</TD> <TD>Melody</TD>     </TR> <TR> <TD>Tuesday</TD>   <TD>09/19/2000</TD> <TD>Christiane</TD> </TR> <TR> <TD>Wednesday</TD> <TD>09/20/2000</TD> <TD>Symphony</TD>   </TR> <TR> <TD>Thursday</TD>  <TD>09/21/2000</TD> <TD>Starflower</TD> </TR> <TR> <TD>Friday</TD>    <TD>09/22/2000</TD> <TD>Miko</TD>       </TR> <TR> <TD>Saturday</TD>  <TD>09/23/2000</TD> <TD>Cleo</TD>       </TR> <TR> <TD>Sunday</TD>    <TD>09/24/2000</TD> <TD>Alyx</TD>       </TR> </TBODY>  <TBODY> <TR> <TD>Monday</TD>    <TD>09/25/2000</TD> <TD>Dancing Star</TD> </TR> <TR> <TD>Tuesday</TD>   <TD>09/26/2000</TD> <TD>Dawn</TD>         </TR> <TR> <TD>Wednesday</TD> <TD>09/27/2000</TD> <TD>Josh</TD>         </TR> <TR> <TD>Thursday</TD>  <TD>09/28/2000</TD> <TD>Ryan</TD>         </TR> <TR> <TD>Friday</TD>    <TD>09/29/2000</TD> <TD>Mary Kay</TD>     </TR> <TR> <TD>Saturday</TD>  <TD>09/30/2000</TD> <TD>Hallie</TD>       </TR> <TR> <TD>Sunday</TD>    <TD>10/01/2000</TD> <TD>Paul</TD>         </TR> </TBODY>  </TABLE> 
like image 667
Yarin Avatar asked Feb 16 '12 21:02

Yarin


People also ask

How do you separate rows in HTML?

Use the <tr> tag for each row. For the first row, use the <th> tag which defines a header cell in an HTML table. For the other rows, use the <td> tag which defines a standard data cell in an HTML table.

How do you separate a table in HTML?

<thead> − to create a separate table header. <tbody> − to indicate the main body of the table. <tfoot> − to create a separate table footer.

Which tag divide HTML table in multiple section explain?

Answer. <hr>tag is used to divide html table in multiple sections.


1 Answers

HTML5 specification isn't saying there can be only one <TBODY> section. Your code is OK. One more example:

<table>  	<thead>  		<tr>  			<th>Fruits</th>  			<th>Vitamin A</th>  			<th>Vitamin C</th>  		</tr>     		</thead>		  	<tbody id="section1">  		<tr>  			<th>Apples</th>  			<td>98 ui</td>  			<td>8.4 mg</td>  		</tr>  	</tbody>  	<tbody id="section2">  		<tr>  			<th>Oranges</th>  			<td>295 ui</td>  			<td>69.7 mg</td>  		</tr>  		<tr>  			<th>Bananas</th>  			<td>76 ui</td>  			<td>10.3 mg</td>  		</tr>  	</tbody>  </table>
like image 198
Martin Ille Avatar answered Sep 22 '22 20:09

Martin Ille