Edit in JSFiddle

<table>
  <col>
  <colgroup span="2"></colgroup>
  <colgroup span="2"></colgroup>
	<colgroup span="2"></colgroup>
  <tr>
    <th scole="row">Supplier</th>
    <th colspan="2" scope="colgroup">JB toys</th>
    <th colspan="2" scope="colgroup">ZA games</th>
		<th colspan="2" scope="colgroup">DD kids</th>
  </tr>
  <tr>
	  <th scope="col">Item</th>
    <th scope="col">Price</th>
    <th scope="col">Delivery Time</th>
    <th scope="col">Price</th>
    <th scope="col">Delivery Time</th>
		<th scope="col">Price</th>
    <th scope="col">Delivery Time</th>
  </tr>
  <tr>
    <th scope="row">Toy trucks</th>
    <td>&pound;25.00</td>
    <td>3 days</td>
    <td>&pound;35.00</td>
    <td>2 days</td>
		<td>&pound;15.00</td>
    <td>6 days</td>
  </tr>
  <tr>
    <th scope="row">Kids Baking set</th>
    <td>&pound;42.00</td>
    <td>4 days</td>
    <td>&pound;58.00</td>
    <td>2 days</td>
		<td>&pound;35.00</td>
    <td>5 days</td>
  </tr>
	<tr>
    <th scope="row">Water balloon kit</th>
    <td>&pound;7.00</td>
    <td>2 days</td>
    <td>&pound;9.00</td>
    <td>6 days</td>
		<td>&pound;11.00</td>
    <td>4 days</td>
  </tr>
</table>
table{
	border: 2px solid #333;
}
tr>*{
	padding: 0.5rem;
	border: 1px solid #666;
}
tr:nth-of-type(1){
	 background-color: #ccc;
}
colgroup:nth-of-type(1){
	 background-color: #ddd;
}