CSS3

プロパティ

font-optical-sizing

[Edge]？。→●、mdn

テキストの描画をそれぞれの大きさでの表示に最適化して表示するかどうかを設定します。

異なるサイズで描画されたテキストは、視覚的な表現を少し違えることで、タイポ グラフィック的に便益が得られることが多い。例えば，サイズが小さいテキストは、読み易くなるよう、描線は太くセリフも大きくされることが多い。対して、より大きいテキストは、より優美で描線の太さの対比が強い造形にされることが多い。

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

auto

ユーザーエージェントは、font-size とスクリーンの画素密度に基づいて、グリフが成す形状を改変してもよい。フォント異体を利用している［OpenType／TrueType］フォント用には、これは opsz フォント異体を利用して行われることが多い。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-optical-sizing:auto; 
">ABCabc012.,_/\</SPAN>

¶このフォントではだめそうだ

none

ユーザーエージェントは、グリフの形状を外見的サイズに応じて改変しないものとする。

<SPAN style="font-family:Test_Font; font-size:30px;
 font-optical-sizing:none; 
">ABCabc012.,_/\</SPAN>

opsz 軸用に異体値を選定するときには、font-size も考慮するものとする ― また、他の設定を考慮してもよい。

注記： ユーザーエージェントには、font-size 用の使用値に近い opsz 軸用の値を給することが期待される。しかしながら、ユーザーエージェントは、他の要因も考慮したいと望むであろう ― ［スクリーンの画素密度／閲覧者の目からのテキストの立体角【すなわち、当のテキストを成す文字の実際のサイズは、（視野角を参照する）px 単位でいくつになるか】］などの。しかしながら、ユーザーエージェントがこの値を選定するときは、［これらの他の副次的な要因は無視することにして、font-size のみ利用する］ことが最善な仕方であろうことが、試験により示されている。

［画素密度／テキストの視覚的なサイズ］は、font-optical-sizing 用に選ばれる異体値に波及し得る。［画素密度／テキストの視覚的なサイズ］が利用者による操作やスタイル変更に呼応して変化したときは、ユーザーエージェントは ― その変化がレイアウトを呼ぶものでない限り ― この異体値用に新たな値を選んではならない。ユーザーエージェントは、どの変化がレイアウトを呼ぶものになるか決定してもかまわない。

注記： pinch-zoom【“つまんで拡大する”】など、利用者による操作のうち一部は、テキストをフローし直さないならば、レイアウトを呼ぶものでないと見なせる。しかしながら、テキストサイズを増やすなどの利用者による他の操作は、テキストをフローし直すので、アクセス能の目的においてはレイアウトを呼ぶものと見なせる。同様に、transform プロパティは、レイアウトを呼ぶものでないと見なせる ― それによる変形は、一般にテキストをフローし直さないので。各ユーザーエージェントは、各操作について、レイアウトを変化させるのか否か裁定してもかまわない。

ユーザーエージェントは、フォントにより直に遂行されていない外見的サイズ法を合成しないものとする。

ユーザーエージェントは、opsz 軸用の値として、［テキスト描画に利用されているフォントがサポートしないもの］は選定しないものとする。これは、選ばれた値をフォントがサポートする範囲に切り詰めることで成し遂げれる。

font-optical-sizing は font-size-adjust と相互作用する。ユーザーエージェントは、前者による外見的サイズ法を適用するときに、後者により調整されたフォント サイズ用に適切な外見的サイズ法値【上述した異体値など】を適用するものとする ― それは、上述した制約の対象になる。

テスト