為什麼需要 text-autospace？
在中文網站或文章中，常常會出現中英文混排 的情境，例如：
「這是一個 CSS text-autospace 範例123。」
如果沒有特別處理，中文字會緊貼英文與數字，看起來擁擠、不易閱讀。
text-autospace 就是專門為這個問題設計的 CSS 屬性。
語法與屬性值
text-autospace: normal | no-autospace | ideograph-alpha | ideograph-numeric | punctuation | insert | replace | auto;
主要屬性值說明
-
normal：預設值，等同啟用ideograph-alpha與ideograph-numeric。 -
no-autospace：完全不插入空白。 -
ideograph-alpha：控制 CJK 與拉丁字母間的空白。 -
ideograph-numeric：控制 CJK 與數字間的空白。 -
punctuation：在標點周圍插入非斷行空白。 -
insert：只在沒有空白的情況下插入。 -
replace：用自動間距替換現有的空白。 -
auto：讓瀏覽器自動選擇最適合的間距方式。
使用範例
中英文與數字混排
p {
text-autospace: ideograph-alpha ideograph-numeric;
}
改善標點排版
.article {
text-autospace: auto;
}
效果：交由瀏覽器決定最佳間距，適合多語言網站。
新版與 IE 舊版的差異
-
更多細節控制：新增
insert與replace，可精細設定空白處理方式。 -
標點支援：
punctuation可避免標點與文字貼太緊。 -
智慧化選項：
auto可依平台、字型與語言自動判定最佳間距。 -
跨瀏覽器差異：IE 僅限自家瀏覽器，新版則重新回到現代瀏覽器規範。
瀏覽器支援情況
目前 text-autospace 屬於 Limited availability（有限支援）：
-
部分 Chrome、Safari、Firefox、Edge 版本已開始實驗性支援。
-
建議搭配
letter-spacing或word-spacing作為 fallback，確保不支援的瀏覽器也能正常顯示。
最佳實踐建議
-
漸進增強（Progressive Enhancement）
-
支援瀏覽器會套用更佳排版效果
-
不支援瀏覽器仍能正常顯示
-
-
搭配其他排版屬性
-
text-autospace與word-spacing、letter-spacing可以疊加使用
-
-
多語言內容選擇
auto-
讓瀏覽器自行調整，避免不同語系混排出現問題
-
結論
text-autospace 是專為東亞語言混排設計的 CSS 屬性。
新版比 IE 舊版更靈活，提供標點支援、自動化選項與更細緻的控制。
現在就可以開始在專案中試用 text-autospace，並搭配其他屬性做 fallback，讓你的網站在 CJK 與西文混排時，擁有專業又舒適的閱讀體驗。
