利用CSS實現純英文數字自動換行

下面為大家帶來一篇CSS程式碼使純英文數字自動換行的簡單實作。內容還挺不錯的，現在就分享給大家，也給大家做個參考。

當一個定義了寬度的塊狀元素中填充的全部為純英文或純數字的時候，在IE和FF中都會撐大容器，不會自動換行

並且當數字或英文中帶有漢字時，會從漢字處換行，而純漢字卻可以自動換行。這個問題如何解決？先來認識兩位主角word-wrap和word-break

word-wrap用來控制css換行

兩種取值：

(1) normal
(2) break-word（此值用來強制換行，內容會在邊界內換行，中文沒有任何問題，英文語句也沒問題。但是對於長串的英文，就不起作用。）

word-break用來控制斷詞

三種取值：

(1)normal

(2)break- all
（是斷開單字。在單字到邊界時，下個字母自動到下一行。主要解決了長串英文的問題。）

(3)keep-all（是指Chinese, Japanese, and Korean不斷詞，一句話一行，可以用來排列古詩喲~）

【解法】

### ####可以在CSS中加入###

word-wrap:break-word;
word-break:break-all;

###以上就是本文的全部內容，希望對大家的學習有所幫助，更多相關內容請關注PHP中文網！ ######相關推薦：#########實如何使用CSS保持頁面內容的寬高比###############關於css3的單位vw和vh的使用######################

以上是利用CSS實現純英文數字自動換行的詳細內容。更多資訊請關注PHP中文網其他相關文章！