所以我才刚刚开始学习 HTML 和 CSS，我无法在 <div> 中呈现文本具有关联的 Google Font 链接字体系列。这是 fiddle :Link to fiddle
这是 html:
<!DOCTYPE html>
<link href="fonts.googleapis.com/css?family=Lobster+Two" rel="stylesheet" type="text/css">
<title>Genuine CV</title>
<link href="css/hover.css" rel="stylesheet" media="all">
<link rel="stylesheet" href="css/cvstyle.css">
<body>
<div class="header">
<div class="navbar" >
<button class="contact hvr-fade">Contact Me</button>
</div>
<div class="name">
<p> Header Text</p>
</div>
</div>
</body>
这是 CSS:
body {
background-color: #433E49 ;
}
button:focus {outline:0;}
.header {
margin: auto;
height: 700px;
width: 50%;
/* solid corresponds to color visibility */
/*border: 2px solid #CBD0D8;*/
padding: 0px;
background-color: whitesmoke;
}
.navbar {
margin: auto;
height: 24px;
width: 100%;
/* solid corresponds to color visibility */
/*border: 2px solid #CBD0D8;*/
background-color: #433E49 ;
}
.contact {
/*remove blue border from chrome*/
background: #7f727d;
border: 1px solid #928490;
color: #fff;
display: inline-block;
padding: 5px 20px;
font: normal 400 12px/1 "Open Sans", sans-serif;
text-align: center;
text-shadow: 1px 1px 0 #000;
float: right;
}
.name {
background: #fff;
color: #000;
padding: 25px 40px;
line-height: 1;
font-weight: 400;
font-variant: normal;
font-style: normal;
font-size: 45px;
font-family: "Lobster Two", cursive;
text-align: center;
text-shadow: 1px 1px 0 #fff;
}
我哪里做错了？谢谢。
最佳答案
改变
<link href="fonts.googleapis.com/css?family=Lobster+Two" rel="stylesheet" type="text/css">
到
<link href="https://fonts.googleapis.com/css?family=Lobster+Two" rel="stylesheet" type="text/css">
关于html - 无法呈现 Google 字体，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40946249/