1、開啟vscode，建立一個測試頁面，在測試頁面中，新增一個寬度=300px的div，同時新增div的紅色邊框。此處設定固定寬度和邊框，是為了更好的演示換行與不換行。

2、在div標籤的內部，新增一些測試的文字，這些文字可以隨便新增，僅僅只是演示而已。文字不要太少，最少要佔據兩行的空間。

3、在瀏覽器中開啟測試頁面，可以看到預設div內部的文字就自動換行了。因此，在沒有設定強制不換行的情況下，讓其自動換行，不需要額外的設定。

4、如果想要div內部的文字強制不換行，使用下面這個css樣式即可。white-space: nowrap;。

5、在瀏覽器中，再次開啟測試頁面可以看到，div內部的文字強制沒有換行了，而且佔用的寬度已經超過了div預設的寬度了。

6、上面的效果，文字雖然強制沒有換行了。只不過還是不太好看，如果想要讓文字在div的寬度內強制不換行，超出的內容使用捲軸，就再加上一個樣式。

7、在瀏覽器中再次開啟測試頁面，就能看到文字沒有超過div預設的寬度了，也沒有換行，div寬度顯示不夠的文字，自動有了捲軸。