自制的图标字体在移动浏览器上呈现带有图标字形的字符

Question

我使用FontLab Studio 5创建了自己的字形图标作为True Type字体。我将九个矢量路径放入Unicode插槽00A1到00A9并导出为TTF。我在我的SCSS中嵌入了这样的字体：

@font-face {
    font-family: 'iconfont';
    src: url('../../font/iconfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

更新：我已经包含了一整套网络字体格式，以此作为原因进行排除。这是新的字体嵌入：

src: url('../../font/jer-icon.eot');
src: url('../../font/jer-icon.eot?#iefix') format('embedded-opentype'),
     url('../../font/jer-icon.woff2') format('woff2'),
     url('../../font/jer-icon.woff') format('woff'),
     url('../../font/jer-icon.ttf') format('truetype'),
     url('../../font/jer-icon.svg#jer_iconsregular') format('svg');

以下是放置图标的SCSS代码：

$icon-one:   "\a1";
/* ... */
$icon-nine:  "\a9";
.element {
    &.before {
        display: inline-block;
        font-family: 'iconfont';
        text-align: center;
        font-size: 90vw;
        width: 90vw;
        content: $icon-one;
    }
}

更新：我还应该包含定义字符集的元标记。

<meta charset="UTF-8" />

在PC和Mac上的Chrome和Firefox上，它完全按预期渲染字形。但是，在Android Chrome浏览器中，字形会使用前面的字符进行渲染。我在这里截了两个行为的截图：

Answer 1

元标记中定义的字符集不正确。

错误：

<meta charset="UTF-8" />

正确：

<meta charset="UTF8" />

删除charset属性中的破折号修复了问题。

感谢Rad Lexus。