Rendered Font

★★★★★
★★★★★
58 users
■フォントの判定プロセス(概要) 1.ブラウザ上で判定対象となる文字列を選択し、右クリックで「rendered 5.次にfont-familyに設定されたフォント名をそれぞれ単独で適用したときのwidthとheightを調べ、4の値と比較し、値が一致したフォントが実際に適用されているフォントであると判定します。 font」をクリック。 > < ※選択文字列の最初の一文字が判定対象となります。 3.テスト用dom要素を作成し、判定対象の1文字を10個(任意)ほど格納する。 判定対象の文字列にfont-family中のどのフォントが適用されているかを調べる 判定対象文字列の指定 font-familyの取得 < 4.まずは2で取得したfont-familyをそのまま適用したときの要素のwidthとheightを調べる 2.文字列を格納するdom要素を取得し、window.getcomputedstyleで要素に指定されているfont-familyを取得。 > < ■使用方法 ■ブラウザのフォント適用ロジックについて font」をクリック。選択文字列の最初の一文字が判定対象となります。 フォント判定したい文字列を選択し、右クリックで「rendered フォントはfont-familyに指定された順番で優先的に適用されます。また、フォントに該当の文字列が格納されていない場合は次の優先順位のフォントが適用され、いずれも適用できるフォントが無い場合はブラウザに設定されたデフォルトのフォントが適用されます。 > つまり同じ文章でも一文字単位で違うフォントが適用される可能性があるため、フォント判定は任意の一文字を対象にする必要があります。
Related