[CSS:Justify]讓中英文混搭的文字,左右齊行

有朋友來信問說, 在他的網頁上,常有中文混搭著英文或者是特殊符號, 以致於在每一個段落的尾端, 總是有點坑坑巴巴的, 雖不至於有多難看, 但還是想知道,是否可以像在 Office Word 中那樣, 能設定一下左右齊行的文字對齊方式。 其實這個左右齊行的文字對齊功能, 在CSS的語法裡,是一直都存在的喔, 不過似乎較少人使用 :) 語法是:
text-align:justify;
但要注意的是, 使用這個文字對齊的語法時, 前提是受影響的文字串,必須是一個『區塊(Block)』才行。 我們來看看使用前後的效果, 下面是沒有使用左右齊行(text-align:justify)的效果, 可以看到文字塊中每一行的尾端都長短不一:
在這個文字區塊中,我們來測試如果有中文, English以及半形符號(對!括弧是最常發生的半形符號),那麼在文字串的尾端就很容易有凹凸不齊的現象,雖然不至於影響什麼,但如果一定要要求整齊,最好是加上Justify這個語法,讓整個文字塊能左右都對齊。
接下來是使用了左右齊行(text-align:justify)的效果,行尾切齊了:
在這個文字區塊中,我們來測試如果有中文, English以及半形符號(對!括弧是最常發生的半形符號),那麼在文字串的尾端就很容易有凹凸不齊的現象,雖然不至於影響什麼,但如果一定要要求整齊,最好是加上Justify這個語法,讓整個文字塊能左右都對齊。