CSS Nowrap:空白空间属性
就像来自另一个时代的人保持着旧习惯和过时的实践一样，在CSS中工作的程序员偶尔也想保持代码的codeyness。在CSS中,nowrap是White Space属性的几个可能值之一。当您想控制默认换行符、制表符和其他固有问题的行为时，您可以拿出旧的White Space属性和怀旧。Nowrap是我们的特性展示，它抑制了“正常的”文本换行，但是White Space的其他值是密切相关的，易于使用，毫无疑问，它们会在你的老式心灵中找到一个特殊的位置。视力不如以前了吗?了解更多关于CSS布局和设计在本课程的所有技能水平。< / p >
White Space属性允许您对元素的包装进行微调。White Space的默认值是正常的，这意味着一个元素(比如段落的文本)将按照预期的方式以标准对齐方式包装，就像这篇博文中的段落一样。文本知道，当它遇到另一个元素(上图)，它应该向下换行到下一行，从而避免覆盖。让我们为我们的段落挑选一些示例文本。这就是我们的HTML:< / p >
这世界怎么了?先是打字机，然后是电脑，现在又是这个?< / p >
我们将使用制表符大小声明来定义制表符:< / p >
P {border: 1px solid #000000;填充:4 px;宽度:250 px;｝
非常标准的东西。现在是时候介绍语法了。对于第一个例子，我将显示默认设置(正常)，以便我们可以建立一个参考点。根据定义,正常的Value将一系列的空格转换为单个空格，并且文本自动换行:< / p >
P{空白:正常;｝
这太简单了。但是结果和我们习惯的一样，一个完美的换行，带边框的文本:< / p >
到目前为止，一切顺利。您可能注意到HTML文本前面和后面的换行符(也就是说，文本没有写:
Back in the day…
)也被删除了，这样边框可以适当地呈现。这是完美的照片。所以拿出你的沃霍尔服装学习黑白摄影艺术。Nowrap
接下来是我们的标题值，nowrap．Nowrap最接近的空格值是否相等在外表上和正常情况完全相反。尽管一系列的空白仍然会缩成一个空白，但文本永远不会换行到下一行(永远不要说never，因为有一个例外:文本将永远继续下去，除非遇到< br/ >标记)。因此,< / p >
P {white-space: nowrap;｝
产生以下结果:< / p >
奇怪,事实上。再次注意文本(在本例中是空白)折叠之前和之后的换行。所有主流浏览器的最新版本都支持White Space属性，但就像大多数CSS属性一样，它的“继承”值在ie7和更早的版本中不受支持，而且一般来说，HTML在那些早期版本的IE中是出了名的有缺陷。老版本的Opera和Safari也将面临两个即将讨论的问题:pre-wrap和pre-line．< / p >
还有三个White Space值，比较后很容易理解正常的和nowrap．< / p >
精准医疗
精准医疗保留空白、换行符和制表符，但不换行文本。换句话说,精准医疗完全遵循源HTML。根据定义,精准医疗最接近的类似正好相反正常的(幻想自己一个精准医疗的人吗?除了正常的？合法化自己这是对我们这个怪异世界的物理理解）.它使元素的行为像HTML中的
标记。精准医疗强制换行和空格折叠nowrap出现:< / p >
这一次，在文本的上方和下方，请注意原始HTML中出现的空格。正如我之前提到的，有时你想保持代码的codeyness;这对教学尤其有用。另外，代码本身就足够乏味了(无意冒犯)，所以稍微格式化一下也没什么坏处;到处都有漂亮的彩色边框……< / p >
Pre-Wrap
如果你什么都喜欢精准医疗除了它不会换行(实际上，它会添加换行符，如下所示)之外，pre-wrap是我送给你的礼物。限制精准医疗它的元素:< / p >
Pre-Line
在以上这些价值观中你拿不准主意吗?每种取一个样本pre-line．这保留了像这样的换行精准医疗和pre-wrap，折叠空格和选项卡nowrap和正常的，并像这样换行文本正常的和pre-wrap．这是一种复杂的说法pre-line是pre-wrap减去空格和制表符的保留。看一看:< / p >
一开始可能很难记住哪个值做了什么，所以为了便于参考，请参考这个表来快速回顾White Space值的不同行为:< / p >
这张桌子会是你最好的朋友。通过比较图片来找出使用哪个空白值会让人非常困惑。如果你发现自己眯着眼睛，拥抱你内心的虐待狂，挑战自己用于移动的CSS和HTML。但你现在应该有很多事情可以让你忙个不停。这是一个相当基本的示例，但与大多数CSS工具一样，它的威力在于使用它的人。< / p >
