我正在使用字体,我最近发现了一些错误。所以我需要了解我做错了什么。
我已在我的机器上安装了Roboto font family,所以现在这就是我在Fonts
下的系统中看到的内容:
但正如你所看到的,我安装了一个家庭,如果我深入其中,我会看到:
因此,在我的Web应用程序中,我有一个定义字体的CSS样式:
.mytext {
font-family "Roboto Regular", Tahoma, sans-serif;
}
.mytext-bold {
font-family "Roboto Bold", Tahoma, sans-serif;
}
问题是,当我可视化页面时,字体不正确。当我可视化页面时,我看到Tahoma
。
所以,如果我打开其中一种字体样式,我会看到:
所以我意识到我必须在family-name
中使用的名称是Roboto
,而不是Roboto Regular
或Roboto Bold
,如Fonts
中的样式名称所示文件夹:
.mytext {
font-family Roboto, Tahoma, sans-serif;
}
.mytext-bold {
font-family Roboto, Tahoma, sans-serif;
}
但是,如何应用不同的风格? myfont-bold
应该具有粗体样式,但如果Roboto
中的名称始终为font-family
,我如何才能获得不同的样式调整?
奇怪的是,如果我使用font-family: Roboto Light, ...
然后它可以工作:(我不明白这里的行为。我应该如何正确引用字体?
答案 0 :(得分:0)
使用css属性font-weight
https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
答案 1 :(得分:0)
另一个答案是正确的。 font-weight:然后以100为增量100-900将改变字体的重量(如果字体具有可用的权重)。使用谷歌字体可以让您对这里发生的事情有所了解。嵌入时:
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900" rel="stylesheet">
您可以看到Google字体内容投放网络(CDN)提供的不同权重,这是向您的网站用户提供他们可能未在其系统上安装的字体的常用方法。因此,如果上面是您的HTML或安装了Roboto,那么:
.mytext {
font-family: Roboto, Tahoma, sans-serif;
font-weight: 400;
}
会给你一个正常的体重Roboto,并且:
.mytext-bold {
font-family: Roboto, Tahoma, sans-serif;
font-weight: 700;
}
会给你大胆的。希望这会有所帮助。