[精讚] [會員登入]

[HTML/CSS] PER標籤中要折字換行(PRE中防止容器破壞)

在pre中因為不會自動的換行,如果一行的內容很長,就會把容器撐開,要防止容器被長文字破壞的方法

此文完整連結 http://n.sfs.tw/m10570

複製連結 [HTML/CSS] PER標籤中要折字換行(PRE中防止容器破壞)@精讚
(文章歡迎轉載,請尊重版權註明連結來源)
2019-02-22 13:59:41 By 張○○

在pre中因為設置 

  white-space: pre;

的屬性,因此不會自動的換行,如果一行的內容很長,就會把容器撐開,破壞容器外觀。

相關連結Tyler Longren有提供解決法:

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap !important; /* Mozilla, since 1999*/
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

 

參考資料

[1] https://stackoverflow.com/questions/248011/how-do-i-wrap-text-in-a-pre-tag

[2]   [HTML] CSS中的折字換行或不換行(防止容器破壞)@新精讚

[相關連結]

https://www.longren.io/wrapping-text-inside-pre-tags/

你可能有興趣

[vi/vim] 移除行尾的空白

vi上要移除行尾的空白的一點小技巧

[WIndows] 程式視窗的上緣跑到螢幕外面怎麼辦

這近不知怎麼搞的,我的EXCEL開啟時他最上面的選單跑到螢幕的外面 所以我也拉不回來,不知怎麼辦?

[PERL] 一個SQL上的錯誤

一個SQL上的觀念錯誤,浪費了我半小時查錯和半小時寫這篇筆記。

線上格式化/最小化你的javascript 程式碼

我想用編輯器來格式化javascript,試了二三套,還是覺得線上的這個最好

[HTML/CSS] PER標籤中要折字換行(PRE中防止容器破壞)

在pre中因為不會自動的換行,如果一行的內容很長,就會把容器撐開,要防止容器被長文字破壞的方法