css – Chrome中的Roboto字体问题

我在使用Roboto字体系列的chrome中遇到了问题.

这在firefox中运行良好,但是在图片中可以看到,Chrome不会在F和L之间给出字母间距.

在铬：

在Firefox中：

解决方法

这称为 typographic ligature.您可以阻止Chrome显示它,如下所示：

h1 {
    letter-spacing: 10px;
    font-variant-ligatures: none;
}

不幸的是,这并不适用于所有webkit浏览器. Safari无论如何都会显示结扎线.

阅读更多

> MDN: “font-variant-ligatures”

演示

Try before buy