固定二维码正方形尺寸需给设相等width/height（如120px），表格加table-layout:fixed，禁用百分比宽，img用object-fit:contain；条形码文字错位则加padding-bottom或关闭displayvalue改用独立div；并排时用flex布局对齐；打印模糊优先用svg输出并确保颜色为十六进制。
表格单元格里二维码总被拉变形，怎么固定正方形尺寸
二维码天生是正方形，但 <td> 默认按内容撑开或继承表格布局，一旦单元格宽高不等，<code>qrcode.js 或 JsBarcode 生成的 canvas/svg 就会被浏览器强行缩放，导致扫码失败。
- 给目标
<td> 显式设置 <code>width和height相等，例如style="width:120px;height:120px;" - 禁用表格自动调整：在
<table> 上加 <code>style="table-layout:fixed;"，再配合td { overflow:hidden; } - 避免用百分比宽度——比如
width="50%"在不同行高下会失准；优先用 px 或 rem - 如果用
<img>标签嵌入 data URL，记得加style="max-width:90%"防止裁切 - 给
<td> 加 <code>padding-bottom（至少8px），而不是依赖条形码库的textMargin参数 - 关闭库自带文字渲染：
displayValue: false，改用单独<div class="barcode-label"> 放在条形码下方，并设 <code>text-align:center - 若用
font-size控制文字大小，注意单位统一——12px比1em更可控，因表格单元格 font 继承链复杂 - 打印时务必测试：浏览器「打印预览」中开启「背景图形」，否则
background-color和文字颜色可能不显示 - 给两个
<td> 套同一类名（如 <code>class="code-cell"），再用 CSS 设置display:flex; align-items:center; justify-content:center; - 若需严格对齐基线（比如文字描述在同一水平线），给外层容器设
vertical-align:middle，而非依赖line-height - 移动端适配时，避免用
float布局——flex 更稳定；同时检查viewportmeta 是否漏写 - 优先用 SVG 输出：调用
JsBarcode时传format: "svg"，再用outerHTML提取字符串插入 DOM - 打印前临时替换 canvas → img：
const img = new Image(); img.src = canvas.toDataURL("image/png", 1.0);，确保 1.0 是最高质量 - PDF 导出库（如 jsPDF）对 SVG 支持有限，建议先用
canvg把 SVG 渲染成 canvas，再转 PNG 插入 - 关键提醒：所有颜色必须用十六进制（如
#000000），避免rgb()或命名色（如black），后者在部分打印引擎中解析失败
条形码文字覆盖错位，底部文字总跑出单元格
条形码库（如 JsBarcode）默认把文字渲染在条形码下方，但表格单元格没有内边距时，文字会紧贴边界甚至被截断，尤其在打印预览中更明显。
并排显示条形码和二维码时左右间距不一致
两个码并列放在同一行 <tr> 的相邻 <code><td> 中，看似结构对称，但因条形码是长条状、二维码是方块，实际占用视觉宽度差异大，人眼感知“不齐”。
<ul>
<li>不要只靠 <code>text-align:center —— 条形码内容长度不同会导致整体宽度浮动；统一用 min-width + max-width 限定容器
导出为 PDF 或打印时码图模糊或消失
Canvas 生成的条形码/二维码在转 PDF 时容易像素化，SVG 虽清晰但某些打印驱动不识别 <svg></svg> 内联样式，导致黑块或空白。
