white-space是CSS的屬性，其作用是規定文本不進行換行。

white-space有以下幾個值：

1、normal：該值為默認值，段落前後的空白會被瀏覽器忽略。如下所示：

<div style="width:200px;height:200px;white-space:normal;">    This is an Action!    </div>

我們在This的前面加了許多空白，在Action的後面也加了許多空白。但是結果如下：

2、pre：段落前後的空白會被瀏覽器保留，文本不會換行。如下所示：

3、nowrap：文本不會換行，直到遇到<br>標簽為止。如下所示：

先展示normal的結果：

<div style="width:10px;height:80px;white-space:normal;">    This is an Action!    </div>

結果：

如果換為nowrap，則：

<div style="width:10px;height:80px;white-space:nowrap;">    This is an Action!    </div>

結果：

4、pre-wrap：保留前後空白符，但是會進行正常的換行。如：

<div style="width:10px;height:80px;white-space:pre-wrap;
 
">    Thisisan Action!    </div>

結果：

看到了沒？如果段落之間有空格，空格也會換行。

5、pre-line：合並空白序列符，但會保留換行符。什麽意思呢？看到上面的pre-wrap的結果了嗎？接下來讓我們看一看pre-line的結果：

<div style="width:10px;height:80px;white-space:pre-line;">    This is an Action!    </div>

結果：

<div style="width:200px;height:80px;white-space:pre-line;
 
">    This is an Action!    </div>

結果：

pre-line也就是說，將段落前後的空白符去掉，如果在換行的時候有空白符單獨一行的，將空白符也去掉。

6、inherit：從父元素繼承white-space的屬性值。

每天CSS學習之white-space