IE11及更早版本不支持white-space: pre-wrap，仅识别pre/nowrap/normal；需改用pre-line配合word-wrap: break-word和word-break: break-all实现兼容折行。
pre 标签加 white-space: pre-wrap 在 IE11 及更早版本里根本不会自动折行——这不是你写错了，是 IE 压根不支持这个值。
IE 不支持 pre-wrap 是硬伤，不是配置问题
IE10/IE11 对 white-space 的支持停留在 pre、nowrap、normal 三个值；pre-wrap 和 pre-line 全部被忽略，样式面板里会直接显示为划掉（strikethrough）。即使写了 -ms-white-space: pre-wrap 也没用，IE 没实现它。
- 检查方式：打开 IE 开发者工具 → 查看 computed 样式 → 找
white-space，若显示为pre（而非你写的pre-wrap），说明已被降级 - 后果：超长无空格文本（如 base64 字符串、长 URL）水平溢出，不折行也不滚动
- 别试
@supports (white-space: pre-wrap)—— IE11 会直接跳过整个规则块，毫无 fallback
word-wrap: break-word 在 IE 里能起作用，但仅限“单词内断行”
word-wrap: break-word（现标准名 overflow-wrap: break-word）是 IE5.5 就支持的老属性，在 IE11 里完全可用，但它只解决“长单词溢出”，对纯空格分隔的文本或已有换行符的 pre 内容无效。
HR面试评价助手-Word版
下载
🎯 HR面试评价助手（Word版格式） 生成可直接复制到Word文档的标准格式HR面试评价 【使用方式】 1. 发送口令：HR面试评价 2. 粘贴JD文字 3. 上传简历文档 4. 上传面试记录（可选） 5. 复制生成的评价到Word 【输出特点】 - 纯文本格式，可直接粘贴到Word - 层次清晰，标题加粗...
- 它不会让
pre里的长行按容器宽度折行，只会把一个超长无空格字符串（比如aaaaaaaaaaaaaaaaaaaaa）在中间切开 - 必须和
white-space: pre配合才有点效果，例如：pre { white-space: pre; word-wrap: break-word; } - 单独给
pre加word-wrap: break-word而不改white-space，在 IE 里基本没反应
真正兼容 IE 的方案：放弃 pre-wrap，改用 white-space: pre-line + word-break
pre-line 是 IE8+ 就支持的值：它会合并多余空格，但保留源码中的换行符（\n），再配合 word-break: break-all 或 word-wrap: break-word 处理长无空格段，能逼近 pre-wrap 效果。
立即学习“前端免费学习笔记（深入）”；
- 适用场景：日志输出、代码片段、带人工换行的文本（非纯机器生成的超长单行）
- 推荐组合：
pre { white-space: pre-line; word-wrap: break-word; word-break: break-all; } - 注意：
word-break: break-all在 IE 中会把中文词也硬切（如“智能对话式”切成“智/能/对/话/式”），若内容以中文为主，优先用word-wrap: break-word单独控制 - 移动端 Safari 9–13 需额外加
word-wrap: break-word，否则pre-wrap不生效——这点常被忽略
最易被忽略的一点：IE 下 pre 默认有上下外边距（margin），且字体可能撑高导致视觉上“像没折行”。务必重置 margin: 0; line-height: 1.4;，否则调试时容易误判是否生效。
