สีแบบอักษรในตารางไม่ได้รับการสืบทอดจาก parent div

<div style="color: purple;">
  <p>Some text</p> <!-- text here is purple -->
  <table>
    <tr>
      <td>Table cell 1</td> <!-- text here is NOT purple -->
      <td>Table cell 2</td> <!-- text here is NOT purple -->
    </tr>
  </table>
  Another text <!-- text here is purple -->
</div>
<body style="color: purple;">
  <p>Some text</p> <!-- text here is purple -->
  <table>
    <tr>
      <td>Table cell 1</td> <!-- text here is purple -->
      <td>Table cell 2</td> <!-- text here is purple -->
    </tr>
  </table>
  Another text <!-- text here is purple -->
</body>