white-space: pre-wrap; 是 CSS 中用于控制文本空白处理的属性值，其核心功能是保留文本中的空格和换行符，同时允许内容自动换行以适应容器宽度。以下是关键特性：

核心特性

1. ‌保留空格和换行‌：文本中的所有空格（包括多个空格和制表符）和换行符（回车符）都会被保留，不会被合并或忽略。

2. ‌自动换行‌：当文本超出容器宽度时，会自动换行以适应内容。

3. ‌等宽字体显示‌：通常与 font-family: monospace; 结合使用，确保每个字符占用相同宽度。

与 pre 的区别

• ‌pre-wrap‌：保留空格和换行，但允许自动换行。

• ‌pre‌：保留空格和换行，但不允许自动换行（内容溢出容器）。

示例

<div style="width: 100px; white-space: pre-wrap;">
  这是第一行
  这是第二行
  这是第三行
</div>

上述代码会保留换行和空格，同时根据容器宽度自动换行。

应用场景

• ‌代码展示‌：在技术文档中展示编程代码，保持缩进和格式。

• ‌ASCII 艺术‌：完整展示字符图形，保留空格和换行。

• ‌文本比对‌：在版本控制中准确展示文本差异。

注意事项

• ‌首行缩进问题‌：若 <pre> 标签或 white-space: pre-wrap; 内有回车符，可能导致首行缩进效果。解决方法是确保标签和内容间无回车。

总之，white-space: pre-wrap; 是处理格式敏感文本的利器，确保内容在网页上呈现时与源代码完全一致。