一尘不染

指定Google字体的样式和粗细

css

我通过链接标签导入了三张脸,普通,粗体,ExtraBold。正常人脸可以正确显示,但是我无法弄清楚如何在CSS中使用字体的变体

我尝试将以下所有内容用作字体家族的属性,但没有dice:

  • ‘Open Sans Bold’
  • ‘Open Sans 700’
  • ‘Open Sans Bold 700’
  • ‘Open Sans:Bold’

谷歌文档本身并没有提供太多帮助。任何人都知道如何编写CSS规则以显示这些变体?


阅读 720

收藏
2020-05-16

共1个答案

一尘不染

他们使用常规CSS。

像这样使用常规字体家族:

font-family: 'Open Sans', sans-serif;

现在,您可以通过添加来确定字体应具有的“粗细”

对于半粗体

font-weight:600;

大胆的(700)

font-weight:bold;

超粗体(800)

font-weight:800;

像这样,它的后备证明,因此,如果Google字体应“失败”,则您的备用字体Arial / Helvetica(Sans-
serif)使用的字体与Google字体的粗细相同。

很聪明:-)

请注意,必须通过标头中的链接标签url(google字体url的族查询参数)专门导入不同的字体粗细。

例如,以下链接将同时包含权重400和700:

<link href='fonts.googleapis.com/css?family=Comfortaa:400,700'; rel='stylesheet' type='text/css'>
2020-05-16