英文本元不換行,漢字可以,你需要這個css樣式

2021-08-30 04:32:32 字數 1730 閱讀 1332

今天遇到乙個問題,在對話頁面,輸入aaaaaa…,一直到100(最多100)個字元,傳送之後,發現超過了對話方塊的長度,沒有換行,數字也是一樣,但是輸入100個漢字,就可以自動換行。

在f12裡檢視對話方塊的樣式,是用white-space: normal來控制換行,預設是normal,

一長串英文本元(中間沒空格)不會自動換行,比 如:sssssssssssssssssssss…不能處理自動換行,而漢字字元卻可以自動換行。原因是:

英文本母之間如果沒有空格,系統認為是乙個單詞,就不會自動換行。漢字就沒有這種情況。

對於這種情況,要使用斷詞屬性word-break:brrak-all,或者換行屬性word-wrap:break-word,

word-wrap:break-word與word-break:break-all共同點是都能把長單詞強行斷句(換行),不同點是word-wrap:break-word會首先起乙個新行來放置長單詞,新的行還是放不下這個長單詞則會對長單詞進行強制斷句;而word-break:break-all則不會把長單詞放在乙個新行裡,當這一行放不下的時候就直接強制斷句了。

輸入ddddddddddd ssssssssssssssssssssss…,分別用兩種屬性,區別如下:

具體屬性如下:

這裡貼出white-space的屬性

主要用的就是著兩種,normal會忽略空白,打多個空格只顯示乙個,nowrap是強制不換行,經常用於單元格長度過長時,用省略號顯示,下面三個屬性一起使用。

超出隱藏(overflow:hidden;)

強制在同一行顯示(white-space: nowrap;)

省略號(text-overflow:ellipsis;)

英文本元和漢字自動換行和不換行的設定

一 英文換行 div p 只對英文起作用,以字母作為換行依據 div p 只對英文起作用,以單詞作為換行依據 注意 有的時候英文單詞是乙個整體不能拆開!若不同瀏覽器將超出部分隱藏,可以新增 overflow auto 二 中文換行以及強制不換行 div p 只對中文起作用,強制換行 div p 強制...

匹配漢字英文本元

2012 12 07 18 23 7639人閱讀收藏 舉報匹配中文 u4e00 u9fa5 英文本母 a za z 數字 0 9 匹配中文,英文本母和數字及 u4e00 u9fa5 a za z0 9 同時判斷輸入長度 u4e00 u9fa5 a za z0 9 w u4e00 u9fa5 uf90...

python 隨機生成漢字 英文本元

生成漢字 第一種方法 unicode碼 在unicode碼中,漢字的範圍是 0x4e00,9fbf importrandom defunicode val random.randint 0x4e00,0x9fbf returnchr val 這個方法比較簡單,但是有個小問題,unicode碼中收錄了...