JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<thead>
<tr>
<th class="colorme">Heading</th>
<th>Heading 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Text 1</td>
<td>Text 2</td>
</tr>
</tbody>
</table>
CSS
table {
border-collapse:collapse;
border-spacing:0;
-moz-box-sizing: border-box;
}
table thead {
background: none repeat scroll 0% 0% rgb(242, 242, 242);
border-width: 1px;
border-style: solid;
border-color: rgb(242, 242, 242) rgb(242, 242, 242) rgb(204, 204, 204);
-moz-border-top-colors: none;
-moz-border-right-colors: none;
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
border-image: none;
}
.colorme {
background-color:purple;
border:1px solid blue !important;
}
table tr th {
border:1px solid red;
background:green;
padding:.3em;
}
tbody td {
border:1px solid orange;
background-color:#5f3e2a;
}