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

2022-06-25 07:30:24 字數 1133 閱讀 4180

一、英文換行

div p/*只對英文起作用,以字母作為換行依據*/

div p/*--只對英文起作用,以單詞作為換行依據*/

注意:有的時候英文單詞是乙個整體不能拆開!!!(若不同瀏覽器將超出部分隱藏,可以新增:overflow:auto;)

二、中文換行以及強制不換行

div p/*只對中文起作用,強制換行*/

div p/*強制不換行,都起作用*/

三、強制不換行以及超出寬度部分文字隱藏

.p5//*不換行,超出部分隱藏且以省略號形式出現*/

要想相容ie和ff,需設定white-space: nowrap;,這樣設定,不論是英文還是漢字,也不管是否有空格都會不換行顯示

注意:div或者p標籤裡面要有乙個寬度才可以換行,要不然沒有作用!!!

解釋:word-wrap和word-break

word-wrap用來控制換行

兩種取值:

(1)normal

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

word-break用來控制斷詞

三種取值:

(1)normal

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

(3)keep-all(是指chinese, japanese, and korean不斷詞,一句話一行,可以用來排列古詩喲~)

white-space : normal | pre | nowrap   

normal  :  預設值。預設處理方式。文字自動處理換行。假如抵達容器邊界內容會轉到下一行   

pre     :  換行和其他空白字元都將受到保護。這個值需要ie6+或者 !doctype 宣告為   

standards-compliant mode 支援。如果 !doctype 宣告沒有指定為 standards-compliant mode,  

此屬性可以使用,但是不會發生作用。結果等同於 normal 。參閱 pre 物件  

nowrap  :  強制在同一行內顯示所有文字,直到文字結束或者遭遇 br 物件。  

相容性: ie5.5 +,  firefox  

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

今天遇到乙個問題,在對話頁面,輸入aaaaaa 一直到100 最多100 個字元,傳送之後,發現超過了對話方塊的長度,沒有換行,數字也是一樣,但是輸入100個漢字,就可以自動換行。在f12裡檢視對話方塊的樣式,是用white space normal來控制換行,預設是normal,一長串英文本元 中...

js實現連續英文本元自動換行

irefox中連續英文本元如果要css控制強制換行,探索了n久,發現是實現不了的 逼不得已的時候就用js指令碼進行控制吧 英文本元自動換行,通過js指令碼截斷字串,此方法通用ie6,ie7,firefox相容解決辦法 sssssssssssssssss sssssssssssssssssssssss...

div強制換行和強制不換行

1 強制不換行,同時以省略號結尾。你好朋友朋友朋友我為什麼不能看到效果啊 2 css自動換行 div3 css強制英文單詞斷行 div若是div巢狀,要使內層div根據內容自動換行,則可只設定外層的div寬,和 white spance nowrap即可。word break break all和w...