我之前在用html2pdf处理表格样式的时候，刚好碰到过类似的问题，给你分享下我当时的解决办法：

html2pdf对CSS边框的渲染逻辑和浏览器有点不一样，如果直接给table加边框，很容易因为单元格的默认边框导致看起来每个td都有框。你可以试试用border-collapse来合并边框，同时清除单元格的默认边框：

.Flex.Standard.FlexTable {
  /* 给整个表格设置边框 */
  border: 1px solid #333;
  /* 合并表格边框，避免单元格和表格边框重叠 */
  border-collapse: collapse;
}

/* 清除单元格的默认边框，确保只有表格整体有框 */
.Flex.Standard.FlexTable td,
.Flex.Standard.FlexTable th {
  border: none;
}

这样设置后，整个table只会显示一圈边框，单元格之间不会有额外的线条。

html2pdf对CSS选择器的优先级和宽度计算逻辑有时候比较“固执”，尤其是当表格是动态生成没有内联样式的时候。你可以试试这几个思路：

1. 提高选择器优先级：用更具体的选择器来覆盖默认样式，比如加上父容器的选择器（根据你的实际页面结构调整）：

/* 假设主内容区的类是main-content */
.main-content .Flex.Standard.FlexTable {
  width: 100%;
  /* 强制表格按设置的宽度布局，避免被内容撑开超出范围 */
  table-layout: fixed;
}

2. 使用!important强制生效：如果优先级还是不够，可以临时用!important来确保样式被应用：

.Flex.Standard.FlexTable {
  width: 100% !important;
  table-layout: fixed;
}

table-layout: fixed这个属性很关键，它会让表格优先遵循你设置的宽度，而不是自动根据单元格内容调整宽度，能有效避免表格超出主内容区域。

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