使用::before插入文字时需设display为block或inline-block并配white-space:normal或pre-wrap，同时设置width/max-width，content中换行需用\A或pre-wrap多行字符串。
在使用 ::before 伪元素插入文字时，若内容含空格或换行符但未按预期折行，通常是因为伪元素默认为 inline 显示，且 white-space 的默认行为（normal）会合并空白、忽略换行。解决关键在于显式控制显示模式与空白处理规则。
::before 默认是 inline，不支持 width、text-align 等块级特性，也影响换行表现。若需文字在指定宽度内自动折行，必须设为块级上下文：
display: block —— 适合独占一行、需设置宽高/对齐的场景display: inline-block —— 适合与前后文本同行，但仍需内部换行控制display: inline（默认值），它会忽略 width 和多数换行相关样式仅改 display 不够，还需匹配合适的 white-space 值：
white-space: normal —— 允许换行，合并连续空白（推荐大多数情况）white-space: pre-wrap —— 保留源码中的换行符和空格，同时允许容器内自动折行（适合带手动换行的提示文案）white-space: nowrap（强制不换行）或 pre（保留空白但不自动折行）若伪元素内容过长却不换行，很可能是没有限制宽度——block 元素默认撑满父容器，但换行触发依赖「可用宽度」：
width: 200px 或 max-width: 100%，让浏览器知道在哪截断max-width: fit-content 或配合 word-break: break-word 处理超长单词伪元素的 conte 值若来自 CSS 字符串（如 
content: "第一行\n第二行"），CSS 并不解析 \n 为换行——它只是普通字符。真想换行得：
white-space: pre-wrap + 实际换行（即写成多行字符串，注意缩进会影响显示）content: "第一行" "\A" "第二行";，再配 white-space: pre 或 pre-wrap