html默认将连续空白符压缩为一个空格，需通过white-space属性控制。1. white-space: normal（默认），合并空格并忽略换行；2. nowrap，禁止换行直至遇到；3. pre，保留所有空白符；4. pre-wrap，保留空白符并允许自动换行；5. pre-line，合并空格但保留换行；6. break-spaces，类似pre-wrap但空格序列占用空间。此外，可使用 插入不间断空格，或用zuojiankuohaophpcnpre>标签保留格式。换行未生效时，可使用标签或设置white-space为pre或pre-line。white-space用于整体空白符控制，而仅用于强制换行。
HTML空白符的处理，说白了，就是浏览器怎么对待你敲下的那些空格、换行和制表符。默认情况下，HTML会把连续的空白符压缩成一个空格，这有时候会让你抓狂，尤其是你想精确控制文本格式的时候。
解决方案：
HTML处理空白符的方式是由CSS的white-space属性控制的。理解并灵活运用这个属性，你就能驯服HTML的空白符了。
立即学习“前端免费学习笔记（深入）”；
normal(默认值): 就像上面说的，连续空白符会被合并成一个空格，换行符也会被忽略。除非遇到<br>标签或者块级元素，否则文本不会换行。nowrap: 跟normal很像，但它会阻止文本换行，直到遇到<br>标签。小心使用，不然你的文本可能会溢出容器。pre: 这个属性告诉浏览器，你要精确地保留所有空白符，包括空格、换行和制表符。文本会按照你源代码中的格式显示，就像<pre>标签一样。pre-wrap: 保留空白符，但允许文本在必要时自动换行。这个属性比较实用，既能保留格式，又能适应不同的屏幕尺寸。pre-line: 合并空白符，但保留换行符。也就是说，连续的空格会被压缩成一个，但你在代码中敲的换行会生效。break-spaces: 与pre-wrap类似，但是会将任何保留的空格序列占用显示空间。
除了white-space，还有一些小技巧可以用来控制空白符：
HTML实体
CSS
word-break和overflow-wrap: 这两个属性可以控制单词的断行方式。word-break: break-all;会在任何字符之间断行，而overflow-wrap: break-word;只会在单词太长无法容纳时才断行。使用
<pre>标签: 如果你想显示代码或者其他需要精确格式的内容，<pre>标签是个不错的选择。它会保留所有的空白符。
连续空格在HTML中无法直接显示？
是的，HTML默认会将多个连续的空格合并成一个。这是HTML的设计特性，目的是为了更好地处理文本的排版和显示。但正如前面提到的，你可以使用 实体来插入不间断空格，或者使用CSS的white-space属性来改变浏览器的默认行为。
如何用CSS控制HTML的空格显示？
CSS的white-space属性是控制HTML空格显示的关键。不同的属性值会产生不同的效果：
- 想保留所有空格和换行，可以使用
white-space: pre;。 - 想保留空格，但允许自动换行，可以使用
white-space: pre-wrap;。 - 想保留换行，但合并空格，可以使用
white-space: pre-line;。 - 想让文本不换行，可以使用
white-space: nowrap;。 - 让空格序列占用显示空间，可以使用
white-space: break-spaces;。
选择哪个值取决于你的具体需求。
为什么我的HTML代码中的换行没有生效？
HTML默认会忽略换行符，除非你使用了<br>标签或者块级元素。如果你想让代码中的换行生效，可以使用<pre>标签或者CSS的white-space: pre;或white-space: pre-line;属性。pre会保留所有空白符，包括换行，而pre-line会合并空格，但保留换行。
<br>标签和white-space属性有什么区别？
<br>标签是一个HTML元素，它强制换行。white-space属性是一个CSS属性，它控制浏览器如何处理空白符，包括空格、换行和制表符。<br>标签只能用于换行，而white-space属性可以控制多种空白符的处理方式。选择哪个取决于你的需求。如果只是想简单地换行，可以使用<br>标签。如果需要更精细地控制空白符，可以使用white-space属性。
