最常见原因是content属性未设置或值为none，导致伪元素不生成盒模型；其次需确保宿主元素可见、display非none，且content值正确（如content: "“"或content: "\201C"），并配合display:inline和margin-right等样式控制间距与显示。
为什么 ::before 插入的双引号不显示？
最常见原因是元素默认不是 display: inline 以上（比如 p 是块级），而 ::before 伪元素要求宿主元素有可渲染的盒模型；但更隐蔽的问题是：如果段落内容为空、或被 visibility: hidden/display: none 影响，::before 也不会渲染。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 确保目标元素（如
p）没有被设为display: none或content: none - 显式设置
p { position: relative; }（非必须，但方便后续定位调整） - 用
content: "“";而不是content: '"';—— CSS 中单引号内不能直接写未转义的双引号字符
content 中该用直角引号还是弯角引号？
中文排版推荐使用弯角引号（“”），而非 ASCII 直角引号（"）——后者在中文字体下常显得窄小、位置偏高。但要注意：不同系统/字体对 Unicode 弯角引号的支持程度不一，尤其旧 Android 或某些等宽字体可能 fallback 到方块或错位。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先用 Unicode 字符：
content: "“";（左双引号 U+201C）和content: "”";（右双引号 U+201D） - 避免用 HTML 实体（如
“）——CSScontent不解析 HTML 实体 - 若需兼容极旧环境，可改用
content: "\201C";（十六进制 Unicode 转义）
如何让前置引号和文字之间有合理间距？
直接写 content: "“ "; 看似简单，但空格宽度受字体影响大，且在 white-space: nowrap 下可能被折叠。更可靠的方式是用 margin 或 padding 控制距离，但注意：伪元素默认是 inline，margin-right 有效，margin-left 对其自身无效。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 给
::before加margin-right: 0.2em;（相对字体大小，比固定像素更健壮） - 若需精确对齐（如引号顶部与首字平齐），加
vertical-align: top;并配合line-height微调 - 避免用
padding——它会扩大伪元素盒，可能触发换行或遮挡文字
多个段落都加引号时，怎么避免最后一段也带引号？
典型场景是引用块（blockquote）里的多段 p，按规范通常只在首段前加左引号，末段后加右引号。纯 CSS 没有“当前是否为最后一段”的选择器，但可以利用兄弟选择器组合规避。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 只给第一个
p加前置引号：blockquote > p:first-of-type::before { content: "“"; } - 给最后一个
p加后置引号：blockquote > p:last-of-type::after { content: "”"; } - 如果段落间有其他元素（如
div、hr），:first-of-type可能失效，此时改用:nth-of-type(1)更稳
font-family: "PingFang SC" 和 "Consolas" 下表现可能天差地别——调样式时务必在目标环境中真机验证。 
