大佬教程收集整理的这篇文章主要介绍了多个字体权重，一个@ font-face查询，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
实际上，@ Font-face有一种特殊的风味，可以满足您的要求。
这是一个示例，该示例使用相同的字体系列名称，并且具有与不同字体相关联的不同样式和粗细：
@Font-face {
Font-family: "DroIDserif";
src: url("DroIDserif-Regular-webFont.ttf") format("truetype");
Font-weight: normal;
Font-style: normal;
}
@Font-face {
Font-family: "DroIDserif";
src: url("DroIDserif-Italic-webFont.ttf") format("truetype");
Font-weight: normal;
Font-style: italic;
}
@Font-face {
Font-family: "DroIDserif";
src: url("DroIDserif-Bold-webFont.ttf") format("truetype");
Font-weight: bold;
Font-style: normal;
}
@Font-face {
Font-family: "DroIDserif";
src: url("DroIDserif-BoldItalic-webFont.ttf") format("truetype");
Font-weight: bold;
Font-style: italic;
}
现在，您可以指定Font-weight:bold或Font-style:italic对所需的任何元素进行指定，而不必指定Font-
family或覆盖Font-weightand Font-style。
body { Font-family:"DroIDserif", Georgia, serif; }
h1 { Font-weight:bold; }
em { Font-style:italic; }
strong em {
Font-weight:bold;
Font-style:italic;
}
有关此功能和标准用法的完整概述，请参阅本文。
我必须导入Klavika字体，并且已经收到多种形状和大小的字体：
Klavika-Bold-Italic.otf
Klavika-Bold.otf
Klavika-Light-Italic.otf
Klavika-Light.otf
Klavika-Medium-Italic.otf
Klavika-Medium.otf
Klavika-Regular-Italic.otf
Klavika-Regular.otf
现在，我想知道是否有可能仅通过一个@font-face-query 将它们导入CSS
，即weight在查询中定义的位置。我想避免将查询复制/粘贴8次。
所以像：
@font-face {
font-family: 'Klavika';
src: url(../fonts/Klavika-Regular.otf),weight:normal;
src: url(../fonts/Klavika-Bold.otf),weight:bold;
}
以上是大佬教程为你收集整理的多个字体权重，一个@ font-face查询全部内容，希望文章能够帮你解决多个字体权重，一个@ font-face查询所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。