quotes属性对table、td、tr无效，因其仅作用于q或blockquote等语义化引用标签，且需配合::before{content:open-quote}及可渲染display值才能生效。
quotes 属性不能直接作用于 table、td 或 tr 元素来“为表格内引用添加括号”——它只对显式调用 content: open-quote 或 close-quote 的伪元素生效，且目标元素必须是语义化引用标签（如 q、blockquote），不是表格单元格。
为什么给 td 设 quotes 没效果？
浏览器不会在 td 上自动触发引号插入逻辑，哪怕你写了：td { quotes: "〔" "〕" "（" "）"; }
也完全无效，因为：
• td 默认没有 ::before/::after 规则调用 open-quote
• quotes 不继承，也不作用于纯文本内容
• 表格单元格是容器，不是引用语义节点
真正可行的写法：把引用语义落到 q 或 blockquote 上
如果表格某格里真有需要多层嵌套的引用文本，正确做法是让 HTML 结构承载语义，CSS 控制样式：
• 在 td 里嵌套 <q lang="zh">他说<q>其实<q>我不同意</q></q></q>
• 然后用 CSS 针对 q 设置：
使用 Puppeteer + Chrome 将 HTML 渲染为中文 PDF，自动处理图表等待、Tab 展开、动画、测高、白边消除、防分页，适用于看板、报表、网页和交互图表转 PDF。
q:lang(zh) { quotes: "「" "」" "『" "』" "〝" "〞"; }<br>q::before { content: open-quote; }<br>q::after { content: close-quote; }
注意：
• 必须为每个
q 显式声明 lang，Safari iOS 不响应父级 lang 继承•
q 默认是内联元素，若引号不显示，加 q { display: inline-block; }
表格中混用多语言引用时的兼容陷阱
移动端尤其容易失效，原因很实际：
• Android WebView（尤其 Chromium 90 以下）完全忽略 quotes 声明
• Safari iOS 对 q:lang(ja) 这类选择器支持极弱，常 fallback 到英文双引号
• 更可靠的做法是放弃 lang + quotes 自动匹配，改用硬编码：
[lang="zh"] td q::before { content: "「"; }<br>[lang="zh"] td q::after { content: "」"; }<br>[lang="ja"] td q::before { content: "『"; }<br>[lang="ja"] td q::after { content: "』"; }
• 这样绕过浏览器引号查表机制，直接控制输出字符，兼容性提升明显
真正容易被忽略的是：表格本身不参与引号渲染链——quotes 生效与否，只取决于你是否在语义正确的元素（q/blockquote）上，同时满足「设了 quotes」+「写了 ::before { content: open-quote }」+「该元素可渲染伪元素（display 非 none/inline）」这三个条件。缺一不可。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
