我正在尝试使用Raleway字体家族作为我网站上的标题。在本地测试中，它工作正常，但是当推送到git并在git页面上运行时，它不起作用。我什至在目录中指定了文本字体TTF文件，但仍然无法正常工作。我在做什么错了？
网站
https://codesniper99.github.io/Portfolio/
我的html索引文件
<!DOCTYPE html>
<!-- copyright akhil vaid if anybody copies this my code is here so good luck 2017UCO1521 -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="main.css">
</head>
<body style="color:black"></body>
<div class="container text-pri" style="font-family:Open-sans; padding: 0%;margin-right: 0%; ">
<!-- Header -->
<div class="parallax">
<span class="topbar" > ABOUT</span>
<span class="topbar" > SKILLS</span>
<span class="topbar" > EXPERIENCE</span>
<span class="topbar" > ACHIEVEMENTS</span>
<span class="topbar" > CONTACT ME</span>
<span class="center rcorners2 " style="font-family:Raleway ;font-size: 4.0em;">
<span style="color: #E04343;">A</span><span >KHIL</span>
<span style="color: #FFE800;">V</span><span>AID</span>
</span>
</div>
<!-- Introduction -->
<div class="intro rcorners1">
<h3 style="text-align: center;">ABOUT ME</h3><br>
<p>
I'm a second year Under-graduate student currently pursuing Computer Science and Engineering at
NSIT, New Delhi, India. I'm new to the industry and keen to expand my skill set.<br> <br> I have a curiosity in
the field of Web Development and Competitive Programming and using it to solve real world
problems and am willing to take up opportunities to delve into it.
<br>
<br>
</p>
</div>
<!-- Skills -->
<h5><b>
Skills and Technologies
</b>
</h5>
<ul>
<li>C++ (GNU 14.2), C
</li>
<br>
<li>
Java
</li>
<br>
<li>
Python 3.1
</li>
<br>
<li>
HTML (HTML -5, Canvas)
</li>
<br>
<li>
CSS3 (Boot-Strap, Materialize CSS Frameworks)
</li>
<br>
<li>
JavaScript (Learning)
</li>
<br>
<li>
ExpressJS (Learning)
</li><br>
<li>
Experience with Django Framework
</li><br>
<li>
Knowledge of Git and VCS
</li><br>
</ul>
<br>
<!-- Experience -->
<h5><b>
Experience
</b>
</h5>
<p>
<ul>
<li> Currently working as Lead Back-end Developer at ICTS (IntuiComp TeraScience) under
guidance of IIT-Delhi and Dr. Arpan Kar. Developing a Learning Management system for
machine learning students and professionals alike to take part in and avail lectures and
conduct hackathons globally. Has been successfully launched in Afghanistan, Hong-Kong,
France. [<a href="www.icts-learninganalytics.com">www.icts-learninganalytics.com</a>] (2018-present)
</li>
<br>
<li>
Working as Lead-developer for a trading firm in creating proprietary software using MQL4
on MT4 and Uniglobe platform(2017-present)
</li>
<br>
<li>
Created RESTful API and website for an Android application focusing on decreasing Smoking
Addiction in individuals by positive reinforcement. It used Django framework and we created
our own local server.
</li>
<br>
<li>
Made a working Hospital-Management DBMS (Database Management system) for 3rd
Semester project. It was created using JDBC in Netbeans IDE.
</li>
<br>
<li>
Made an Android application to maintain attendance for college students. Developed in
native android
</li>
<br>
<li>
Came in top 100 teams in SE- Asia region in ACM-ICPC online qualifier round.
</li>
</ul>
</p>
<!-- Academics -->
<h5><b>
Academic Achievements
</b>
</h5>
<ul>
<li>Qualified for ACM-ICPC Regionals 2018-19 at IIT Kharagpur and Kanpur
</li>
<br>
<li>
Secured AIR- 2412 rank in JEE Mains.
</li>
<br>
<li>
Top 10% of College Department (COE)
</li>
<br>
<li>
Top 10% in CBSE class 12th result
</li>
<br>
<li>
10 CGPA in class 10th
</li>
<br>
<li>
Secured and qualified as a JSTSE scholar from State of New Delhi
</li>
</ul>
</div>
</body>
</html>
我的main.css
.intro
{
background-color: #f5d7f8;
margin-left: 64px;
margin-right: 64px;
font-size: 23px;
margin-top: 50px;
padding-left: 64px;
padding-right: 64px;
padding-bottom: 30px;
padding-top:35px;
}
.rcorners1 {
border-radius: 25px;
padding: 20px;
}
.rcorners2 {
border-radius: 12px;
padding: 15px;
}
@font-face { font-family: Raleway; src: url('text/Raleway/Raleway-Light.TTF'); }
@font-face { font-family: Open-sans; src: url('text/open-sans/OpenSans-Regular.TTF'); }
.parallax {
background-image: url("images/laptop.jpg"); opacity: 0.75;
min-height: 650px;
background-attachment: fixed;
background-position: center;
width:100%;
height:100%;
background-repeat: no-repeat;
background-size: cover;
}
.text-pri{
background-color:whitesmoke;
}
body {
margin: 0 !important;
padding: 0 !important;
}
.center {
position: absolute;
left:30%;
top: 40%;
width: 40%;
min-width: 300px;
text-align: center;
background-color: black;
color: white;
opacity: 0.85;
font-size: 48px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.topbar{
color:white;position: relative;
padding-top: 30px;
margin-top:30px;
margin-left:30px;
font-size: 20px;
}
我的git存储库
答案 0 :(得分：2)
使用Raleway google font已将Raleway字体导入到CSS中，因此您无需从任何地方调用。并将其用作font-family: 'Raleway', sans-serif;
在线字体使用对您的网站很有帮助。
还使用font-wight css将bold，light和font-weight:200的字体制作为font-weight:300 font-weight:600，与导入的CSS相同。
@import url('https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
.intro
{
background-color: #f5d7f8;
margin-left: 64px;
margin-right: 64px;
font-size: 23px;
margin-top: 50px;
padding-left: 64px;
padding-right: 64px;
padding-bottom: 30px;
padding-top:35px;
}
.rcorners1 {
border-radius: 25px;
padding: 20px;
}
.rcorners2 {
border-radius: 12px;
padding: 15px;
}
/* @font-face { font-family: Raleway; src: url('text/Raleway/Raleway-Light.TTF'); }
@font-face { font-family: Open-sans; src: url('text/open-sans/OpenSans-Regular.TTF'); } */
.parallax {
background-image: url("https://codesniper99.github.io/Portfolio/images/laptop.jpg"); opacity: 0.75;
min-height: 650px;
background-attachment: fixed;
background-position: center;
width:100%;
height:100%;
background-repeat: no-repeat;
background-size: cover;
}
.text-pri{
background-color:whitesmoke;
}
body {
margin: 0 !important;
padding: 0 !important;
}
.center {
position: absolute;
left:30%;
top: 40%;
width: 40%;
min-width: 300px;
text-align: center;
background-color: black;
color: white;
opacity: 0.85;
font-size: 48px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.topbar{
color:white;position: relative;
padding-top: 30px;
margin-top:30px;
margin-left:30px;
font-size: 20px;
}<!DOCTYPE html>
<!-- copyright akhil vaid if anybody copies this my code is here so good luck 2017UCO1521 -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="main.css">
</head>
<body style="color:black"></body>
<div class="container text-pri" style="font-family:Open-sans; padding: 0%;margin-right: 0%; ">
<!-- Header -->
<div class="parallax">
<span class="topbar" > ABOUT</span>
<span class="topbar" > SKILLS</span>
<span class="topbar" > EXPERIENCE</span>
<span class="topbar" > ACHIEVEMENTS</span>
<span class="topbar" > CONTACT ME</span>
<span class="center rcorners2 " style="font-family: 'Raleway', sans-serif;font-size: 4.0em;">
<span style="color: #E04343;">A</span><span >KHIL</span>
<span style="color: #FFE800;">V</span><span>AID</span>
</span>
</div>
<!-- Introduction -->
<div class="intro rcorners1">
<h3 style="text-align: center;">ABOUT ME</h3><br>
<p>
I'm a second year Under-graduate student currently pursuing Computer Science and Engineering at
NSIT, New Delhi, India. I'm new to the industry and keen to expand my skill set.<br> <br> I have a curiosity in
the field of Web Development and Competitive Programming and using it to solve real world
problems and am willing to take up opportunities to delve into it.
<br>
<br>
</p>
</div>
<!-- Skills -->
<h5><b>
Skills and Technologies
</b>
</h5>
<ul>
<li>C++ (GNU 14.2), C
</li>
<br>
<li>
Java
</li>
<br>
<li>
Python 3.1
</li>
<br>
<li>
HTML (HTML -5, Canvas)
</li>
<br>
<li>
CSS3 (Boot-Strap, Materialize CSS Frameworks)
</li>
<br>
<li>
JavaScript (Learning)
</li>
<br>
<li>
ExpressJS (Learning)
</li><br>
<li>
Experience with Django Framework
</li><br>
<li>
Knowledge of Git and VCS
</li><br>
</ul>
<br>
<!-- Experience -->
<h5><b>
Experience
</b>
</h5>
<p>
<ul>
<li> Currently working as Lead Back-end Developer at ICTS (IntuiComp TeraScience) under
guidance of IIT-Delhi and Dr. Arpan Kar. Developing a Learning Management system for
machine learning students and professionals alike to take part in and avail lectures and
conduct hackathons globally. Has been successfully launched in Afghanistan, Hong-Kong,
France. [<a href="www.icts-learninganalytics.com">www.icts-learninganalytics.com</a>] (2018-present)
</li>
<br>
<li>
Working as Lead-developer for a trading firm in creating proprietary software using MQL4
on MT4 and Uniglobe platform(2017-present)
</li>
<br>
<li>
Created RESTful API and website for an Android application focusing on decreasing Smoking
Addiction in individuals by positive reinforcement. It used Django framework and we created
our own local server.
</li>
<br>
<li>
Made a working Hospital-Management DBMS (Database Management system) for 3rd
Semester project. It was created using JDBC in Netbeans IDE.
</li>
<br>
<li>
Made an Android application to maintain attendance for college students. Developed in
native android
</li>
<br>
<li>
Came in top 100 teams in SE- Asia region in ACM-ICPC online qualifier round.
</li>
</ul>
</p>
<!-- Academics -->
<h5><b>
Academic Achievements
</b>
</h5>
<ul>
<li>Qualified for ACM-ICPC Regionals 2018-19 at IIT Kharagpur and Kanpur
</li>
<br>
<li>
Secured AIR- 2412 rank in JEE Mains.
</li>
<br>
<li>
Top 10% of College Department (COE)
</li>
<br>
<li>
Top 10% in CBSE class 12th result
</li>
<br>
<li>
10 CGPA in class 10th
</li>
<br>
<li>
Secured and qualified as a JSTSE scholar from State of New Delhi
</li>
</ul>
</div>
</body>
</html>
答案 1 :(得分：0)
您好，您可以尝试使用以./
src: url('./text/Raleway/Raleway-Light.TTF')