css Google Fonts字体无法加载

9udxz4iz  于 2022-12-20  发布在  Go
关注(0)|答案(7)|浏览(295)

我试图将PT Sans添加到一个时事通讯中,但由于某种原因,它无法加载,我复制了几乎所有的代码,但它不工作。我将非常感谢任何人谁可以帮助。
下面是CSS代码:

h1, h2, h3 {
    font-family: 'PT Sans', sans-serif;
}

和HTML代码:

<link href="http://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet" type="text/css">

编辑:下面是CSS的其余部分:

h1, h2, h3 {
    font-family: 'PT Sans', sans-serif;
}

#logo{width:810px}

#saveDateText{
    position:relative;
    top:30px;
    left:80px;
    font-size:50px;
    color:rgb(228,242,214)
}

#october{
    position:relative;
    top:0px;
    left:90px;
    font-size:35px;
    color:rgb(228,242,214)
}

#raftLogo{
    position:relative;
    top:-125px;
    left:550px;
}

#saveTheDate {
    background-color:rgb(123, 190, 48);
    height:170px;
    width:810px;
}

#honoring {
    position:relative;
    background-color:rgb(9, 65, 30);
    width:810px;
    top:-30px;
    font-size:20px;
    height:400px;
}

#honoringTextDiv {
    position:relative;
    width:740px;
    left:70px;
    top:50px
}

#infoText {
    color:white;
    font-size:25px;
}

#honoringText {
    color:rgb(242, 183, 51);
}

#benifit{
    color:white;
    font-size:25px
}

#morgridge {
    position:relative;
    top:20px
}
#sponsorships {
    position:relative;
    left:20px;
    top:-30px;
    height:300px;
    width:400px;
    border-right-style:solid;
    border-right-color:rgb(160, 202, 129);
    border-right-width:1px;
}

#inventiveSponsorsDiv {
    position:relative;
    left:425px;
    top:-155px
}
#dmns {
    position:relative;
    top:-40px;
}
#1stbank {
    position:relative;
    top:80px;
}

#inspirationalSponsors, #inventiveSponsors{
    position:relative;
    top:0px;
    color:rgb(123,190,48);
    font-size:18px;
}
#inventiveSponsors {
    top:-20px;
}

#names, #names2 {
    line-height:25px;
    font-size:14px

}
#names2 {
    position:relative;
    top:-94px;
    left:160px;
    text-align:left;
}
dly7yett

dly7yett1#

尝试使用不带“http”的URL:

<link href="//fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet" type="text/css">
ngynwnxp

ngynwnxp2#

一些提示:
1.在<head>的开头使用HTML代码,然后再使用其他代码。例如:
<head> <link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'> /* Rest of the code after this */ </head>
2.如果这样做不起作用,请将以下内容放入CSS文件中:@import url(http://fonts.googleapis.com/css?family=PT+Sans);

k7fdbhmy

k7fdbhmy3#

问问你自己:

1. Are you developing online or offline (if online check number 2)

2. Make sure your browser does not have a shield icon because this 
   means the browser is blocking the font and you need to click
   the allow button.

3. Check for spelling errors or anything suspicious.

4. Finally @import is the safest way I think.
0ejtzxu1

0ejtzxu14#

我有同样的问题,如果使用CSS标记:
“字体:3em粗体;“---这会覆盖google的API调用并加载你的下一个默认字体。
解决方案:使用字体样式和字体大小

mrfwxfqh

mrfwxfqh5#

检查css文件是否在供应商样式表之后加载。例如,bootstrap.css应该在css文件之前。

vwkv1x7d

vwkv1x7d6#

和其他人一样,我也遇到了同样的问题,可惜这些评论都帮不了我。但我想我找到了解决这个问题的方法...你可以打开URL链接,例如:@import url('**https://fonts.googleapis.com/css2?family=Montserrat:wght@100;400;900&display=swap**');而且你有一些css,你可以复制并粘贴到你的样式表中。用这种方式不是很好,但是它工作起来很...
我希望我能帮助一些人:)

bfhwhh0e

bfhwhh0e7#

我今天遇到了这个问题。如果你用一个httpsurl做了测试,你需要把链接href="http://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet"改为href="https://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet"。否则,就会有冲突的问题。
我希望有人会希望。

相关问题