HTML:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1 style="font-family: 'Noto Sans', sans-serif;"">Test</h1>
<h1 style="font-family: 'Roboto', sans-serif;">Test</h1></h2>
</body>
</html>
CSS：
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&family=Roboto:wght@700&display=swap');
</style>
我正在尝试导入此字体，但是对于和，字体都没有显示。我该如何解决这个问题？
代码中有一个额外的引号。
更换
<h1 style="font-family: 'Noto Sans', sans-serif;"">Test</h1>
带
<h1 style="font-family: 'Noto Sans', sans-serif;">Test</h1>
然而，由于可读性和易于维护，我不会编写内联CSS来设置字体的样式。
试试这个吧，
在HTML文件中，执行此操作。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans&family=Roboto:wght@700&display=swap" rel="stylesheet">
</head>
<body>
<h1 style="header-style-1">Test</h1>
<h1 style="header-style-2">Test</h1></h2>
</body>
</html>
在一个单独的CSS文件(在本例中为style.CSS(中，执行此操作。
.header-style-1 {
font-family: 'Noto Sans', sans-serif;
}
.header-style-2 {
font-family: 'Roboto', sans-serif;
}
首先您应该删除"">
<h1 style="font-family: 'Noto Sans', sans-serif;"">Test</h1>
更改此
<h1 style="font-family: 'Noto Sans', sans-serif;">Test</h1>
接下来你可以帮助这个-->https://www.w3docs.com/snippets/css/how-to-import-google-fonts-in-css-file.html#:~：text=打开%20Google%20Fonts%20和%20follow，(在%20HTML%20或%20CSS中(。
在html文件的头中，写下这行
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans&family=Roboto:wght@700&display=swap"
rel="stylesheet"
/>
您可以使用以下代码来修复错误
@font-face {
font-family: myFirstFont;
src: url(sansation_light.woff);
}