css3怎麼實現強制不換行

css3實作強制不換行的方法：先建立一個HTML範例檔案；然後建立一個p標籤；最後透過設定「white-space:nowrap;」樣式實現強制不換行。

本文操作環境：windows7系統、CSS3版、Dell G3電腦。

css實作強制不換行/自動換行/強制換行

在我們日常的編碼中經常會遇到這段文字不可以換行，或者自動換行的需求。雖然這個功能在我們平常很常見但是我相信大家一定不會可以的去記住它吧（至少小月是很懶惰的從來是用什麼查什麼 嘻嘻。。。）。今天我們來學習如何熟練的掌握用css實現文字的強制不換行/自動換行/強制換行的方法。需要的夥伴們可以來一起學習哦！

• 強制不換行

p{
    white-space:nowrap;
}

• 自動換行

p{
    word-wrap: break-word;
    word-break: normal;
}

• 強制英文單字斷行

 p{
    word-break:break-all;
 }

• #CSS設定不轉行：

• overflow:hidden 隱藏
• white-space：normal 預設
• pre 換行和其他空白字元都會受到保護
• nowrap 強制在同一行內顯示所有文本，直到文字結束或遭遇br 物件

• 設定強行換行：

• word-break:
• #normal ; 依照亞洲語言和非亞洲語言的文字規則，允許在字內換行
• break-all : 　該行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任意字內斷開。該值適合包含一些非亞洲文本的亞洲文本
• keep-all : 　與所有非亞洲語言的normal相同。對於中文，韓文，日文，不允許字斷開。適合包含少量亞洲文本的非亞洲文本與之間的高度解決方案

英文不換行

CSS里加上 word-break: break-all; 问题解决。这个问题只有IE才有，在FF下测试,FF可以自己加滚动条，这样也不影响效果

建议大家做Skin时，记得在body里加 word-break: break-all; 这样可以解决IE的框架被英文撑开的问题

以下引用word-break的说明, 注意word-break 是IE5+专有属性

語法： word-break : normal | break-all | keep-all 參數： normal : 　依照亞洲語言和非亞洲語言的文本規則，允許在字內換行 break-all : 　此行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任意字內斷開。該值適合包含一些非亞洲文本的亞洲文本 keep-all : 　與所有非亞洲語言的normal相同。對於中文，韓文，日文，不允許字斷開。適合包含少量亞洲文本的非亞洲文本 說明： 設定或檢索物件內文字的字內換行行為。尤其在出現多種語言時。 對於中文，應該使用break-all 。

推薦學習：《css影片教學》

以上是css3怎麼實現強制不換行的詳細內容。更多資訊請關注PHP中文網其他相關文章！