将Google Web Fonts包含在页面中的首选方法是什么？
通过链接标签？
<link href='http://fonts.googleapis.com/css?family=Judson:400,400italic,700' rel='stylesheet' type='text/css'>
通过样式表中的导入？
@import url(http://fonts.googleapis.com/css?family=Kameron:400,700);
或使用网络字体加载器
我正在使用<object>标签在我的页面中嵌入SVG ,他们应该使用Google字体(例如Roboto).但是,SVG不会选择这些字体,而是默认使用系统字体.
我究竟做错了什么？每个SVG都要求嵌入字体<style>吗？
示例代码:
<head>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
</head>
<body>
<object width="250" height="200" type="image/svg+xml" data="img/popup_image.svg"></object>
</body>
SVG片段:
<text font-size="14" fill="#333" font-family="Roboto">Words go here</text>
我正在构建一个 Angular 应用程序，我使用 scss 进行样式设置并想要导入谷歌字体。
我有一个fonts.scss保存与字体相关的所有内容的地方。我像这样导入谷歌字体：
字体.scss
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;500;700&display=swap');
因为有不同的文件，我需要导入到不同的组件，我有一个名为 的文件，imports.scss其中包含字体和颜色变量。
导入.scss
@import 'src/styles/imports/fonts';
@import 'src/styles/imports/colors';
现在，我的ng 组件可以通过导入使用字体和变量：
@import 'src/styles/imports';
即使变量和字体正常工作，我在 Google Chrome 中收到以下错误：
platform-browser.js:789 GET https://fonts.googleapis.com/css2?family=Poppins:wght@300;400[_ngcontent-dsi-c57];700&display=swap net::ERR_ABORTED 400
在Firefox中我收到此错误：
The resource from "(link to google fonts)" was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
有办法解决这个问题吗？
（我是新来的所以如果这不是问它的地方，请告诉我）
通常我添加<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400,400italic,700' rel='stylesheet' type='text/css'>到<head>我的页面。对于多个页面，总是有可能出现不一致/错误，而且更新每个页面可能会令人头疼。
Can I instead just use @import url(http://fonts.googleapis.com/css?family=Open+Sans); at the first line of my main CSS file?
Advantage to this is updating one CSS file rather than updating every single page where it's in the <head>. But I've read some answers that say there may be a resource loading problem...but that discussion was 3 years ago. Can't find a current answer addressing this.
EDIT
To avoid SO from thinking this is …
我想在我的HTML网站的CSS中的font-family属性中使用googles"source sans pro"字体.我使用Bootstrap作为前端框架.
https://www.google.com/fonts/specimen/Source+Sans+Pro
我怎样才能做到这一点？我是否必须将该文件包含在我的html网站中？
感谢您的任何帮助!
我想在我的网页http://iconablare.in/iconablareredesign上使用Google font Six Cap
它在桌面上运行完美,但它不会在整个网站的移动设备上加载但是当我尝试使用该字体制作新的html文件时
http://iconablare.in/iconablareredesign/style.css它可以在网络和移动设备上完全加载,任何人都可以帮忙吗？
我在两个文件中使用相同的代码.
我当时在html页面上工作，进入了一半，并决定开始设计样式。。。我所有的样式都很好！直到我尝试获得Google字体。我按照所有说明进行操作，并将所有内容正确插入到CSS中。但是，当我在Chrome上查看该页面时，它仅显示“后备”通用sans-serif字体。这是我的CSS：
#page-first-open {
border: 1px solid black;
width: 1000px;
height: 500px;
text-align: center;
margin: auto;
position: relative;
top: 50px;
}
@import url(https://fonts.googleapis.com/css?family=Raleway);
#page-first-open p {
font-size: ;
font-family: 'Raleway', sans-serif;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css">
<script>
</script>
<title>User Test</title>
</head>
<body>
<div id="wrapper">
<div id="page-first-open">
<p>Hello, and welcome to this page. . .<br>
If you don't mind me asking, <br>
What is your name (or what you'd like to be called)?</p>
</div>
</div>
</body>
</html>有人可以告诉我我做错了什么（如果我做错了），或者指出正确的方向来使它工作？