CellPadding 不适用于表格？答案

【问题标题】：CellPadding not working for table?CellPadding 不适用于表格？
【发布时间】：2017-12-18 18:54:50
【问题描述】：

使用 DOM 元素尝试将 cellPadding 添加到表格中：为什么

var FirstTabContent = document.createElement('div');
var Newtable = document.createElement('table');
Newtable.border = "1";
Newtable.cellpadding = "20px 20px 20px 20px";
///////////////
//populate table
///////////////
FirstTabContent.appendChild(Newtable);
return FirstTabContent.innerHTML;

<table border="1">
   <tbody>
      <tr>
         <td>
            <b>id</b>
         </td>
         <td>14079<br>
         </td>
      </tr>
   </tbody>
</table>

cellpadding 在哪里？

【问题讨论】：

标签： html css html-table cellpadding

【解决方案1】：

严格来说，cellPadding（带有大写字母 P）对应于 table 元素本身的 cellpadding 表示属性，它只接受单个长度或百分比：

Newtable.cellPadding = "20";

但是，如果您尝试通过 CSS 将单元格填充应用于此生成的表格（正如 20px 20px 20px 20px 值所暗示的那样），您应该使用 CSS，并且使用 CSS，您需要在 td 元素上设置它而不是桌子：

td {
    padding: 20px;
}

否则，您将需要遍历表格中的所有单元格（添加它们后）并在它们上设置style.padding，这简直是单调乏味。

如果您真的想使用cellPadding 属性，请注意，如果您使用像素值，则只能通过这种方式设置统一填充，因为它只接受单个值。

【讨论】：

【解决方案2】：

它应该是cellPadding，大写P。

设置Newtable.cellPadding = "20px 20px 20px 20px" 可能会将属性设置为所需的值，但不会产生所需的结果。你只能set it to a pixel or a percentage length：

Newtable.cellPadding = "20";

【讨论】：