html空⽩处理,HTML的空⽩符处理规则
HTML 中的“空⽩符”包括空格 (space)、制表符 (tab)、换⾏符 (CR/LF) 三种。
我们知道，在默认情况下，HTML 源码中的空⽩符均被显⽰为空格，并且连续的多个空⽩符会被视为⼀个，或者说，连续的多个空⽩符会被合并。
然⽽在有些时候，我们希望 HTML 源码中的多个连续空格在⽹页浏览器中可以真实地呈现，或者需要源码中的换⾏符能起到真正的换⾏作⽤。于是，我们发现了
标签，它可以真实还原它内部⽂本的空⽩符的真实情况。
于是我们经常会把⼀段表⽰计算机代码的⽂本放进
标签中，它们在浏览器中会表现出⾃⾝的空格缩进和换⾏效果，⽽不需要我们增加额外的样式和标签来控制它的缩进和换⾏。
随着对 CSS 的了解不断深⼊，我们发现，原来这⼀切都是 white-space 属性在安排。
元素之所以如此神奇，是因为它⾃⾝具有 {white-space: pre;} 这⼀默认样式。
white-space 属性
CSS 中的 white-space 属性⽤于设置⽂本空⽩符的处理规则，这其中包括：是否合并空⽩符、是否保留换⾏符、是否允许⾃动换⾏。各属性值的不同⾏为如下表所⽰：
white-space 属性值⼀览表
属性值 空⽩符 换⾏符 ⾃动换⾏ 最早出现于
normal
合并
忽略
允许
CSS 1
nowrap
合并
忽略
不允许
CSS 1
pre
保留
保留
不允许
CSS 1
pre-wrap
保留
保留
允许
CSS 2.1
pre-line
合并
保留
允许
CSS 2.1
(注 ：在 CSS1/2 下，white-space 属性只可应⽤于块级元素；在 CSS 2.1 下，可应⽤于所有元素。)
如果我们需要某个容器元素具有类似
html滚动效果代码
元素的空⽩符处理⾏为，则为它设置 {white-space: pre;} 样式即可。
对 pre-wrap 的需求
我们先解释⼀下上述表格中的“⾃动换⾏”⾏为，它是指某元素内部的⽂本流按照⽂本⽅向排版，当⽂本流遇到限制其继续延伸的边界时，是否换⾏。“不允许⾃动换⾏”则意味着⽂本流会溢出该元素。
因此，{white-space: pre;} 样式有时候并不能满⾜我们的期望。⽐如，在某些不需要特别严谨的场合，或者排版某些对换⾏不敏感的代码⽚断(⽐如 HTML 或 CSS)的时候，我们不希望代码⽚段中的⼀⾏长代码令它的容器元素产⽣⽔平滚动条，因为那样不便阅读。我们希望在这种情况下，长代码⾃动换⾏就好。
这时，对照⼀下上表中各属性值的不同⾏为特征，我们会发现 pre-wrap 这个属性值脱颖⽽出——它正是我们所需要的。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。