關於文字空格換行處理

white-space 屬性會影響到使用者**對源文件中的空格、換行和 tab 字元的處理。

通過使用該屬性，可以影響瀏覽器處理字之間和文字行之間的空白符的方式。從某種程度上講，預設的 xhtml 處理已經完成了空白符處理：它會把所有空白符合併為乙個空格。所以給定以下標記，它在 web 瀏覽器中顯示時，各個字之間只會顯示乙個空格，同時忽略元素中的換行：

this paragraph has many

spaces in it.

可以用以下聲明顯式地設定這種預設行為：

上面的規則告訴瀏覽器按照平常的做法去處理：丟掉多餘的空白符。如果給定這個值，換行字元（回車）會轉換為空格，一行中多個空格的序列也會轉換為乙個空格。

例項 tiy ：white-space: normal

不過，如果將 white-space 設定為 pre，受這個屬性影響的元素中，空白符的處理就有所不同，其行為就像 xhtml 的 pre 元素一樣；空白符不會被忽略。

如果 white-space 屬性的值為 pre，瀏覽器將會注意額外的空格，甚至回車。在這個方面，而且僅在這個方面，任何元素都可以相當於乙個 pre 元素。

例項 tiy ：white-space: pre

注意：經測試，ie 7 以及更早版本的瀏覽器不支援該值，因此請使用非 ie 的瀏覽器來檢視上面的例項。

與之相對的值是 nowrap，它會防止元素中的文字換行，除非使用了乙個 br 元素。在 css 中使用 nowrap 非常類似於 html 4 中用將乙個表單元格設定為不能換行，不過 white-space 值可以應用到任何元素。

例項 tiy ：white-space: nowrap

css2.1 引入了值 pre-wrap 和 pre-line，這在以前版本的 css 中是沒有的。這些值的作用是允許創作人員更好地控制空白符處理。

如果元素的 white-space 設定為 pre-wrap，那麼該元素中的文字會保留空白符序列，但是文字行會正常地換行。如果設定為這個值，源文字中的行分隔符以及生成的行分隔符也會保留。pre-line 與 pre-wrap 相反，會像正常文字中一樣合併空白符序列，但保留換行符。

例項 tiy ：white-space: pre-wrap

例項 tiy ：white-space: pre-line

注意：我們在 ie7 和 firefox2.0 瀏覽器中測試了上面的兩個例項，但是結果是，值 pre-wrap 和 pre-line 都沒有得到很好的支援。

下面的**總結了 white-space 屬性的行為：

值空白符

換行符自動換行

pre-line

合併保留

允許normal

合併忽略

允許nowrap

合併忽略

不允許pre

保留保留

不允許pre-wrap

保留保留

允許