Adding data to your table can entail quite a lot of coding, so, let's keep it to a minimum by formatting the minimum number of cells we need.

Before we add headers and content, we'll change the background color by adding the following code to the table tag (you can choose whichever color you like): background-color: #e9e9e9;. Now you can add your headers and content, and your code should now look like this:

<table style="width: 580px; border: #000000 solid 2px; background-color: #e9e9e9;">
<tbody>
<tr>
<th style="border: 1.5px solid #000000;" colspan="4">This is a Main Header</th>
</tr>
<tr>
<th style="border: 1.5px solid #000000;" colspan="2">This is a Sub-Header</th>
<th style="border: 1.5px solid #000000;" colspan="2">This is a Sub-Header</th>
</tr>
<tr style="border: 1.5px solid #000000;">
<td style="border-right: 1.5px solid #000000;"><em>Item 1</em></td>
<td style="border-right: 1.5px solid #000000;"></td>
<td style="border-right: 1.5px solid #000000;"></td>
<td style="border-right: 1.5px solid #000000;"></td>
</tr>
<tr style="border: 1.5px solid #000000;">
<td style="border-right: 1.5px solid #000000;">The quick brown fox jumps over the lazy dog.</td>
<td style="border-right: 1.5px solid #000000;"></td>
<td style="border-right: 1.5px solid #000000;"></td>
<td style="border-right: 1.5px solid #000000;"></td>
</tr>
</tbody>
</tablel>

And your table like this:
Not exactly what you expected? Cell height too much? Content expanding width of cell? Font and size to small? No problem, we can sort that by adding some coding to the different tags.