Nov. 30th,2020
プロパティについて
＃
概要
| 初期値 | “text-combine-upright: none;” |
| 適用対象 | 非置換インライン要素 |
| 継承 | Yes |
| パーセント値 | パーセント値は指定できません |
| 計算値 | 指定したキーワードと“digits”があれば整数値 |
| アニメーション | 不可 |
“text-combine-upright”プロパティは書字方向が縦書きにテキストの縦中横を指定するプロパティです。
縦中横にされたテキストは1文字分の横幅(“1em”)に収まるように表示されます。横幅がそれよりも大きい場合には文字が圧縮されて表示されます。
“text-combine-upright”プロパティは書字方向が縦書きにテキストにのみ効果があり、横書きのテキストには効果はありません。
サンプルコード
p { text-combine-upright: digits 2;}
＃
値
| 値 | 説明 |
|---|---|
| none | 特別な処理はしません |
| all | すべての連続する字を1文字分の空間に横書きで配置するよう試みます |
digits <integer> |
“<integer>”値で指定した桁数の半角数字(“0”~“9”)は1文字分の空間に横書きで配置します (“<integer>”値は“2”~“4”のみ有効で、“<integer>”値が省略された場合は“2”とみなされます。) |
| 共通キーワード |
＃
＃
縦中横を指定する
<p>
令和<span class="numbers">XX</span>年<span class="numbers">12</span>月<span class="numbers">25</span>日、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で<span class="numbers">7</span>億<span class="numbers">5000</span>万<span class="numbers">km</span>であり、宇宙船JUPITERは打ち上げから木星に到達するまで約<span class="numbers">2</span>年<span class="numbers">5</span>か月かかった。
</p>
.numbers { text-combine-upright: none;}
令和XX年12月25日、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で7億5000万kmであり、宇宙船JUPITERは打ち上げから木星に到達するまで約2年5か月かかった。
.numbers { text-combine-upright: all;}
令和XX年12月25日、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で7億5000万kmであり、宇宙船JUPITERは打ち上げから木星に到達するまで約2年5か月かかった。
.numbers { text-combine-upright: digits 2;}
令和XX年12月25日、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で7億5000万kmであり、宇宙船JUPITERは打ち上げから木星に到達するまで約2年5か月かかった。
“digit”を指定する場合は適用された要素の中にある指定した桁数を満たした数字だけが縦中横で表示されるのでより簡潔に記述することもできます。
<p>
<span class="numbers">令和XX年12月25日</span>、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で<span class="numbers">7億5000万km</span>年<であり、宇宙船JUPITERは打ち上げから木星に到達するまで<span class="numbers">約2年5か月</span>年<かかった。
</p>
令和XX年12月25日、人類はついに木星への有人飛行を成し遂げた。地球から木星までの距離は直線で7億5000万kmであり、宇宙船JUPITERは打ち上げから木星に到達するまで約2年5か月かかった。
