通过内联CSS加载外部字体

是否可以使用内嵌CSS加载外部字体？不适用于外部CSS文件[....]。

是的，您可以按照Stephen Scaff的本文中的文章所示对base64字体进行编码，然后将其放到

style

也可以按照您所描述的浏览器是否支持的方式使用此技术。

<style>  @font-face {    font-family: 'PT Sans';    font-style: normal;    font-weight: normal;    src: local('PT Sans'), local('PTSans-Regular'),      url(data:application/font-woff2;charset=utf-8;base64,d09GRgABAAAAAHowABMAAAAA+OAA) format('woff2');  }  @font-face {    font-family: 'PT Serif';    font-style: normal;    font-weight: normal;    src: local('PT Serif'), local('PTSerif-Regular'),      url(data:application/font-woff2;charset=utf-8;base64,d09GRgABAAAAAIQYABMAAAAA/MAA) format('woff2');  }</style>

每个现代的浏览器都支持WOFF2，因此您应该 _仅_在可预见的将来使用它。此外，这种技术将提高你的速度得分，但 会降低性能的整体（甚至是第一页面加载），编码的base64除非你是唯一的关键页面资产（如倍以上显示的字体字形的）和[异步加载的休息。

在性能方面，目前最好的选择是使用Brotli压缩，并使用将webfont样式表向下传递。