CSS3

プロパティ

font-variant-numeric

→●、mdn

フォントの数量的な整形。

数量的な形に対する制御を指定する。下の例に、これらの値のいくつかを組み合せて、［これらの特能をサポートするフォントによる、テーブル状のデータの描画］に波及させる方法を示す。通常の段落テキスト内では、均衡（可変）幅の数字が利用される一方で、一連の［数字の縦列］を適正に整列するように、一定幅の数字が利用される：

¶図例省く

<numeric-figure-values>

＝[lining-nums | oldstyle-nums]

<numeric-spacing-values>

＝[proportional-nums | tabular-nums]

<numeric-fraction-values>

＝[diagonal-fractions | stacked-fractions]

以下のCSSが組み込んであります：

normal

下に挙げられるどの特能も、可能化されない。

<SPAN style="font-family:Test_Font; font-size:30px;
">Aa0123456789</SPAN><BR>

指定なし

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:normal;
">Aa0123456789</SPAN><BR>

lining-nums

lining 数字（OpenType 特能： lnum）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:lining-nums;
">Aa0123456789</SPAN><BR>

oldstyle-nums

old-style 数字（OpenType 特能： onum）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:oldstyle-nums;
">Aa0123456789</SPAN><BR>

proportional-nums

均衡（可変）幅の数字（OpenType 特能： pnum）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
">Aa0123456789</SPAN><BR>

指定なし

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:proportional-nums;
">Aa0123456789</SPAN><BR>

tabular-nums

一定幅数字（OpenType 特能： tnum）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:tabular-nums;
">Aa0123456789</SPAN><BR>

diagonal-fractions

斜め括線による分数（OpenType 特能： frac）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:diagonal-fractions;
">Aa0123456789 1/3 3/2</SPAN><BR>

stacked-fractions

水平括線による分数（OpenType 特能： afrc）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:stacked-fractions;
">Aa0123456789 1/3 3/2</SPAN><BR>

ordinal

序数を伴なう普通字形（OpenType 特能： ordn）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:ordinal;
">Aa012 1/3 3/2 1st 2nd 3rd 17th 2ab</SPAN><BR>

slashed-zero

スラッシュ付きのゼロ（OpenType 特能： zero）による表示を可能化する。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-variant-numeric:slashed-zero;
">Aa012</SPAN><BR>

<SPAN style="font-family:メイリオ; font-size:30px;
 font-variant-numeric:slashed-zero;
">Aa012あいう漢字</SPAN><BR>

<SPAN style="font-family:ＭＳ 明朝; font-size:30px;
 font-variant-numeric:slashed-zero;
">Aa012あいう漢字</SPAN><BR>

テスト