Question

我有以下问题：

对于我的网站，我从 Google字体（拉丁语，拉丁语扩展，西里尔语，西里尔语扩展）中选择了webfont ＆＃39; Fira Sans Condensed＆＃39; 。为了生成字体格式，我使用了 Font Squirrel ，它为我生成的文件包含 .woff 和 .woff2 扩展程序。

我包含下一个css代码的字体：

@font-face {
  font-family: 'firasanscondensed';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/firasanscondensed-regular.woff2') format('woff2'), url('../fonts/firasanscondensed-regular.woff') format('woff');
}

@font-face {
  font-family: 'firasanscondensed';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/firasanscondensed-bold.woff2') format('woff2'), url('../fonts/firasanscondensed-bold.woff') format('woff');
}

body {
  font-family: 'firasanscondensed', sans-serif;
}

除了字母和＃34; fi＆＃34;和＆＃34; fl＆＃34;。例如：＆＃34; Wi-fi＆＃34;喜欢＆＃34; Wi-＆＃34;。

要解决此问题，我尝试将字体包含更多字体扩展名（ .eot ， < strong> .ttf ）并且顺序不同，但情况没有改变。

然后我使用 Google Fonts 方法，包括：<link href="https://fonts.googleapis.com/css?family=Fira+Sans+Condensed:400,700&subset=cyrillic,cyrillic-ext,latin-ext" rel="stylesheet">。用这种方法我的问题是解决！但对我来说，原则上在本地包含字体。

我在以下浏览器中看到了这个问题：Google Chrome 55.0.2883.87; Mozilla Firefox 51.0.1。在IE10中，问题没有出现！

提前谢谢！

Answer 1

尝试针对字体呈现（或正文）的元素。

body {  
  font-feature-settings: "liga" 1;
}

您可能需要供应商前缀：

body  {
  -webkit-font-feature-settings: "liga" 1;
  -moz-font-feature-settings:    "liga" 1;
  -ms-font-feature-settings:     "liga" 1;
  font-feature-settings:         "liga" 1;
}

可以这种方式切换的功能（如果字体支持它们）是..

liga：标准连字
dlig：酌情连字
onum：旧式数字
lnum：衬砌数字
tnum：表格数字
零：削减零
frac：fractions
sups：上标
subs：subscript
smcp：small caps
c2sc：来自首都的小资本
case：区分大小写的表单
hlig：历史连字
calt：contextual alternates
swsh：swashes
hist：历史形式
ss **：文体集
kern：kerning
locl：本地化表格
rlig：必需的连字
medi：medial forms
init：初始表格
isol：isolated forms
fina：final forms
mark：mark
mkmk：mark-to-mark positioning

它们甚至可以组合成一个这样的规则：

.element {
  font-feature-settings:"liga" 1, "dlig" 1;
}

Answer 2

默认情况下会激活常用连字，但某些字体不支持它们。尝试使用font-feature-settings:"liga" 0; 停用他们这对我有用。

字母组合＆＃34; fi＆＃34;和＆＃34; fl＆＃34;浏览器

2 个答案: