包含自定义字体文本的元素的jQuery height()似乎不一致

时间:2015-12-20 16:56:27

标签: javascript jquery html css

我们有一个div这样:

<body>
    <div class="styled">
        Text
    </div>
</body>

我们的风格看起来像:

 @font-face {
    font-family: 'Liberation Mono'; /*a name to be used later*/
    src: url('LiberationMono-Regular.ttf'); /*local URL to font*/
}

.styled {
    font-size: 200px;
    font-family: "Liberation Mono";
}

现在,如果我们在文档就绪上添加一些Javascript(包括jQuery 2.1.4之后):

<script>
    $(document).ready(function() {
        console.log($("div.styled").height())
    });
</script>

显示的值是控制台 243 ,但是使用开发工具检查div,实际上 227px 高。

使用浏览器中的默认字体(在我们的示例中为Chrome),结果将保持一致。

这是预期的行为吗? 有没有已知的工作?

编辑:该字体适用于download from Font Squirrel

0 个答案:

没有答案