text-spacing-trim
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
text-spacing-trim は CSS のプロパティで、中国語/日本語/韓国語 (CJK) の約物文字（句読点や括弧など）について、隣接する文字との間、およびテキスト行の先頭または末尾に設定する内部空間（カーニング）を制御します。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 123 | 123 | | | 123 | | |
normal 実験的 | 123 | 123 | | | 123 | |
space-all 実験的 | 123 | 123 | | | 123 | |
space-first 実験的 | 123 | 123 | | | 123 | |
trim-start 実験的 | 123 | 123 | | | 123 | |
基本構文
CSS
.japanese-text {
text-spacing-trim: space-all;
}ライブデモ
実務での使いどころ
-
日本語句読点の詰め処理
全角句読点が連続する箇所の余分な空白を自動的に詰め、商業印刷に近い品質の組版を実現します。
注意点
- Chrome系ブラウザのみのサポートであり、Safari・Firefox ではまだ利用できません。
アクセシビリティ
- 文字詰めが過度になるとテキストの判読性が低下する場合があるため、適切な設定値を選択してください。