CSS連續數字文本換行 在網頁設計中，我們常常會遇到一些需要顯示連續數字的情況，比如分頁信息、列表序號等等。但有時候這些數字太長了，導致它們橫向超出了我們定義的寬度，就顯得很難看了。那么如何才能讓這些數字自動換行呢？下面讓我們來學習一下CSS中的連續數字文本換行。 連續數字的非斷點換行 在CSS中，我們可以通過設置white-space屬性來控制元素內的空白。默認情況下，HTML中的空白字符（包括空格、制表符和回車符）都會被折疊成一個空格，只有一個空格會出現在瀏覽器中。對于連續數字文本的換行，我們要利用white-space屬性的nowrap和pre-wrap值。 當我們在CSS中將white-space屬性設置為nowrap時，瀏覽器會強制表示文本不換行，直到遇到一個br標簽為止。這時數字就會超出定義的寬度范圍，顯得很不美觀。 例如：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

CSS： p { width: 80px; white-space: nowrap; } 此時的顯示效果如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 但如果我們將white-space屬性設置為pre-wrap，可以讓連續數字文本按照我們在代碼中定義的方式自動換行。這時候CSS代碼如下： p { width: 80px; white-space: pre-wrap; } 此時的顯示效果如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 通過設置white-space屬性，我們就可以輕松地實現連續數字文本的自動換行了。 總結 CSS的white-space屬性能夠很好地控制元素內空白的處理方式，幫助我們實現各種不同的文本換行效果。在處理連續數字文本時，我們可以將white-space屬性設置為pre-wrap，達到自動換行的效果。