Rendered Font

■ 使用方法

选择你要判断字体的字符串，右击点击“Rendered Font”。
*将判断所选字符串的第一个字符。

■ 浏览器字体应用逻辑

优先按照 font-family 中指定的顺序应用字体。另外，如果字体中没有存储相应的字符串，则应用具有以下优先级的字体，如果没有可应用的字体，则应用浏览器中设置的默认字体。
换句话说，即使在同一个句子中，每个字符也可能应用不同的字体，因此必须对任何一个字符进行字体确定。

■ 字体确定过程（概述）

<指定要判断的字符串>
1.在浏览器上选中要判断的字符串，右键点击“渲染字体”。将判断所选字符串的第一个字符。

<获取字体系列>
2.获取存储字符串的 DOM 元素，并使用 window.getComputedStyle 获取为该元素指定的字体系列。

< 找出要判断的字符串应用了font-family中的哪种字体>
3.创建一个测试 DOM 元素并存储大约 10 个字符（任意）以供判断。
4.首先，检查2中获取的font-family按原样应用时元素的宽度和高度5。接下来查看font-family中设置的每个字体名称独立应用时的宽高，与4的值进行比较，判断符合该值的字体为实际应用的字体。