如何不使用CSS实现HTML表格外边框与内边框颜色不同

你要求不能使用CSS仅通过原生HTML属性实现，有2种兼容性较好的可行方案：

方案1：嵌套表格实现（兼容性最优） #

原理是用外层表格提供红色外边框，内层表格提供黑色内边框，两个表格边距设为0完全贴合，视觉上就是一个完整表格：

• 外层表格仅设置红色外边框，仅包含1行1列，无内边距和外边距
• 内层表格设置黑色边框，承载实际的表格内容
  代码示例：

<!-- 外层表格提供红色外边框 -->
<table border="1" bordercolor="red" cellpadding="0" cellspacing="0" width="400">
  <tr>
    <td>
      <!-- 内层表格承载实际内容，提供黑色内边框 -->
      <table border="1" bordercolor="black" cellpadding="8" cellspacing="0" width="100%">
        <tr>
          <th>表头1</th>
          <th>表头2</th>
          <th>表头3</th>
        </tr>
        <tr>
          <td>内容1</td>
          <td>内容2</td>
          <td>内容3</td>
        </tr>
        <tr>
          <td>内容4</td>
          <td>内容5</td>
          <td>内容6</td>
        </tr>
      </table>
    </td>
  </tr>
</table>

方案2：单元格单独指定边框色 #

原理是给整个表格设置红色外边框后，单独给所有<td>、<th>单元格设置黑色边框属性：
代码示例：

<table border="1" bordercolor="red" cellpadding="8" cellspacing="0" width="400">
  <tr>
    <th bordercolor="black">表头1</th>
    <th bordercolor="black">表头2</th>
    <th bordercolor="black">表头3</th>
  </tr>
  <tr>
    <td bordercolor="black">内容1</td>
    <td bordercolor="black">内容2</td>
    <td bordercolor="black">内容3</td>
  </tr>
  <tr>
    <td bordercolor="black">内容4</td>
    <td bordercolor="black">内容5</td>
    <td bordercolor="black">内容6</td>
  </tr>
</table>

注意：该方案在部分老旧浏览器中可能出现边框颜色重叠偏差，优先推荐方案1使用

内容的提问来源于stack exchange，提问作者Tijana Ilieva