Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add multiple header HTML table?

I want to Design a table that has multiple headers. The table design is there:

Multiple header HTML table design link

like image 280
BM RAFIQ Avatar asked Dec 06 '22 14:12

BM RAFIQ


1 Answers

Have a look at this fiddle

All about colspan and rowspan

<table>
    <thead>
        <tr>
            <th rowspan="2" colspan="1" >
                Client Name
            </th>
            <th rowspan="2" colspan="1">
                Date
            </th>
            <th rowspan="1" colspan="5">
                All Appointments
            </th>
            <th rowspan="1" colspan="3" >
                Fulfilled Appointments
            </th>
        </tr>
        <tr>
            <th>Total number of individual appointments</th>
            <th >Hours Of Care Delivered</th>
            <th>Total Value</th>
            <th>Average Cost Per Hour</th>
            <th>Average Cost Per Hour Per Carer</th>
            <th>Total Number</th>
            <th>Hours Of Care Fulfilled</th>
            <th>Total Value</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>
like image 161
Vincent Vinnicombe Avatar answered Dec 11 '22 12:12

Vincent Vinnicombe