col标签不支持background-color，是CSS规范限制而非bug；它仅支持width、background（非background-color单独）、border、visibility: collapse等有限属性，color、font-size、padding等完全无效，text-align继承不稳定，可靠方案应使用td/th:nth-child(n)设置样式。
col标签不支持background-color？不是bug，是规范限制
给<col>加background-color没反应，不是你漏写了单位或拼错了单词，而是CSS规范明确禁止它生效。浏览器会解析这个样式，但直接丢弃——它不属于<col>允许继承的属性列表。真正能靠<col>控制背景色的场景极少：仅当整列单元格都存在、且表格启用了border-collapse: collapse时，部分浏览器（如Chrome）可能“偶然”渲染出列背景，但Safari和Firefox大多忽略。可靠方案永远是用td:nth-child(n)和th:nth-child(n)组合选中单元格本身。
width属性写在col上为什么经常失效
三个关键条件缺一不可：<col>必须放在<colgroup>内、<colgroup>必须是<table>的直接子元素且位于<caption>之后<thead>之前、table必须设table-layout: fixed。另外，HTML5已废弃width="100"这种写法，必须改用style="width: 100px"或CSS类。如果用了span="3"却只写一个<col style="width: 120px">，那只有第一列被设宽，后两列回退为内容自适应——span不广播样式，只标记逻辑覆盖范围。
text-align、color、padding这些样式为什么不能用
-
text-align：部分浏览器（Chrome）会尝试继承，但Safari基本无视；即使生效，也只影响单元格内文本对齐，无法覆盖td上显式设置的值 -
color、font-size、vertical-align：完全不继承，<col>不是渲染上下文节点，没有文本流 -
padding、margin、border-radius：无效，<col>不占空间、无盒模型
所有这类样式，最终都得落到<td>或<th>上。把它们写在<col>里，等于白写。
使用 Puppeteer + Chrome 将 HTML 渲染为中文 PDF，自动处理图表等待、Tab 展开、动画、测高、白边消除、防分页，适用于看板、报表、网页和交互图表转 PDF。
visibility: collapse和display: none的区别在哪
visibility: collapse是<col>唯一能稳定隐藏整列的合法方式，它让该列从布局中消失，但保持行高一致、不破坏表格结构；而display: none作用于<col>完全无效，作用于<td>则会导致该单元格塌陷、相邻列错位。注意：visibility: collapse在IE中不支持，现代浏览器（Chrome/Firefox/Safari）均已稳定支持。如果需要兼容IE，只能用JS遍历cells手动移除或设display: none，但要同步调整colspan逻辑。
立即学习“前端免费学习笔记（深入）”；
