為了使英語字符不斷開，我在顯示內容的style是text-align:justify; text-justify:inter-ideograph。可是這樣子在后臺添加內容時，如果不是鍵盤輸入的，而是copy到輸入框里的話，這樣前臺顯示出來的帖子內容會把表格撐得很寬。有人說采用自動換行就會解決這個問題style=”word-break:break-all”。可是這樣一來，英語單詞又斷了。如何才能將這兩個矛盾統一起來呢？

---

參考的帖子是這樣的：

• overflow:hidden：超出溢出，通俗點就是超出不顯示
• word-wrap:break-word：自動段字換行。可能是針對與中文字。
• word-break:break-all：是段字換行。它與上面的區別在于，可以斷掉一些
  較長的英文字母，使表單不至于撐破。主要針對于英文。

以下是詳解：

三種樣式都不寫的情況下（只舉英文例子）div的寬度是100px：

ni nia nia nidad niadnai nida nin andisdn nidasndadsfsdf dasdasdadad ada .

第二種情況只寫overflow:hidden div的寬度是100px:
ni nia nia nidad niadnai nida nin

第三種情況overflow:hidden; word-wrap:break-word; div的寬度是100px;

ni nia nia nidad niadnai
nidasndadsfsdf nin ninniadnai nida nin .
注意：由于nidasndadsfsdf的單詞太長所以不能給斷開，所以，整個詞給斷下來了。

第四種情況overflow:hidden; word-wrap:break-word; word-break:break-all;div寬度還是100px。

ni nia nia nidad niadnai nidasnda
dsfsdf nin ninniadnai nida nin .

注意：由于nidasndadsfsdf的單詞被斷開了。
上面的測試都沒有問題，但是放到我的內容上面仍然還有問題。
最后，參考了很多論壇，終于找出了問題

問題原來出在
空格的ASCII碼為32，字符實體 的名字叫做”不中斷空格”，其ASCII碼為160。雖然顯示出來可能 和空格一樣，但瀏覽器可能不會將其和空格一樣對待，所以那串英文成了一個”單詞”，不會自動換行。

你只需將 再替換回去，而且在你的后臺程序中將那句替換空格的語句去掉，如果這樣會影響到排版，也可以將那句replace改成將兩個空格替換成一個全角空格或兩個 ，這樣不會影響到單詞間的單個空格。

原文鏈接

總結

以上是生活随笔為你收集整理的css中实现字符超出宽度自动换行和英语字符不断行的解决方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。