Skip to content

Note

不挑戰記憶力的技術筆記

Menu
Menu

[CSS] word-break, word-wrap文字換行

Posted on 2015 年 7 月 3 日 by febr

[code language=”css”]
word-break: break-all; //單字過長,不管單字,切斷並換行。
word-wrap: break-word; //單字過長,則將單字換行。
[/code]

上面這兩個屬性最好一起用,因為在某些例外情況,chrome遇到特殊字元用break-all是無效的,但break-word可以。
兩者互補,最後的斷行方式,會以break-all為主。

[code language=”css”]
white-space:pre; //保留空白與換行,同 pre tag。
white-space:nowrap; //移除連續空白,移除換行符號(n r), 強迫文字不換行。
white-space:pre-wrap; //保留所有空白,自動換行。
white-space: pre-line;
[/code]

例外情況:wrod-wrap失效,可能是加了white-space: nowrap啊…
css3改用overflow-wrap,與word-wrap是一樣的

發佈留言 取消回覆

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

近期文章

  • [AWS] S3 Object Initiate restore (復原回 Standard)
  • [Windows] 使用者快速登出的方法 Logout/ Logoff/Sign Out from Windows User Account
  • [Windows] Windows 11 安裝Server管理工具Install RSAT(Remote Server Administrator Tools)
  • Chrome出現:你的連線不是私人連線 Your connection is not private
  • [C#] 取得 Request URL 的方法

近期留言

    彙整

    分類

    • Ajax
    • Android
    • ASP
    • ASP.NET MVC
    • Azure
    • C#
    • Cisco
    • CSS
    • Delphi
    • Developer Tools
    • Framework
    • FreeBSD
    • Git
    • HTML5
    • javascript
    • jQuery
    • Juniper
    • Linux
    • Mac
    • PHP
    • Python
    • Server&OS
    • Software
    • SQL server
    • Sublime Text
    • Ubuntu
    • Visual Studio
    • Vmware
    • Web Design
    • Web Development
    • Windows
    • WordPress
    • 未分類
    • 未分類

    彙整

    分類

    • Ajax
    • Android
    • ASP
    • ASP.NET MVC
    • Azure
    • C#
    • Cisco
    • CSS
    • Delphi
    • Developer Tools
    • Framework
    • FreeBSD
    • Git
    • HTML5
    • javascript
    • jQuery
    • Juniper
    • Linux
    • Mac
    • PHP
    • Python
    • Server&OS
    • Software
    • SQL server
    • Sublime Text
    • Ubuntu
    • Visual Studio
    • Vmware
    • Web Design
    • Web Development
    • Windows
    • WordPress
    • 未分類
    • 未分類

    其他操作

    • 登入
    • 訂閱網站內容的資訊提供
    • 訂閱留言的資訊提供
    • WordPress.org 台灣繁體中文
    © 2025 Note | Powered by Superbs Personal Blog theme