製作網頁時,有時想要讓文字自動斷行,但是偏偏文字不聽話(例如:aaaaa….連續的英文字串或是很長的單字),此時網頁設計師們該怎麼辦呢?

文字不聽話時,偉大的網頁設計師們可以這樣…
使用 style.wordBreak 語法(支援IE家族5.5版以上),
有三個參數可以指定:
normal(依網頁預設)
break-all(打散單字型態,每一個字母均為一個字元)
keep-all(保持單字型態)

小小示範說明:

表格寬400px 使用 style.word-break:normal
ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZ

表格寬400px 使用 style.word-break:break-all
ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZ

表格寬400px 使用 style.word-break:keep-all
ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZ

※後記:其實還有 style.word-wrap[break-word] ,但是其相對較麻煩,word-wrap:break-word; 只對所屬Object Width有作用。

tanjun

顯示留言

Share
Published by
tanjun

最新文章

2020中秋佳節快樂!

秋空明月掛,掛滿中秋意~祝您中...

4 年 ago

2020金年非您莫屬(鼠)

新的一年又來到, 祝 2020...

5 年 ago

2019諸事如意

農曆新年來到,祝新的一年朋友們...

6 年 ago

Merry Christmas 2018

叮叮噹~ 叮叮噹~ 聖誕老公公...

6 年 ago

[花博]最終幕。百合之戀

花博開幕至今,已經快兩個月了....

14 年 ago

[Taipei 101]2011 New Year’s Fireworks

為了抓住新年一開頭,那道幸福的...

14 年 ago