10月 12

[文章分享]CSS與結構化標記

1,095 CSS, 小技巧, 筆記, 網路 沒人回應

對於Web GUI設計師而言，Table 一直是構成GUI最便捷容易的方法，但是，太多的 Table tag 往往造成複雜的程式碼，使維護、解譯的負擔增加，CSS與結構化標記可以讓這落差縮短…

繼續閱讀 …

9 月 30

[CSS]CSS size

1,132 CSS, 小技巧, 筆記 沒人回應

一般在設CSS時，因為熟悉的關係，所以字體都以 Pixel 為主，但是CSS還有多種設法可以讓整個網頁活起來…

繼續閱讀 …

9 月 29

[CSS]word-break語法

1,881 CSS, 小技巧, 筆記 沒人回應

製作網頁時，有時想要讓文字自動斷行，但是偏偏文字不聽話(例如：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有作用。