JSFiddle - React, Tailwind, and code Playground

HTML

<body>
        <table>
            <tr>
                <td>TR 1 - TD 1 </td>
                <td>TR 1 - TD 2 </td>
            </tr>
            <tr>
                <td>TR 2 - TD 1</td>
                <td>
                    TR 2 - TD 2
                    <table>
                        <tr>
                            <td>Table 2 - A </td>
                            <td>Table 2 - B </td>
                        </tr>
                        <tr>
                            <td>Table 2 - C</td>
                            <td>Table 2 - D</td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </body>

CSS

table {border:solid 1px red;}
td {border:solid 1px gray;}

body>table tr {background-color:lightgray;}
body>table tr tr {color:blue;}
body>table>tbody tr {color:red;}