External CSS + Google font
Question
For some reason, the Google font that is imported doesn't work? The font isn't displayed correctly. Here is the HTML.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
<link href="/main.css" rel=stylesheet type="text/css">
</head>
<body>
<div class="testing">
<h1>nothing to see</h1>
</div>
</body>
</html>
My CSS file:
.testing h1 {
font-family: 'Pacifico';
font-style: normal;
}
2 answers
solution1
0 2016-01-27 04:22:22
The problem is that the second link tag(the one containing main.css) has the wrong address to main.css. Try putting main.css in the same folder as your HTML file and delete the slash(/) right next to the href value main.css as shown
<link href="main.css" rel=stylesheet type="text/css">
If you want your CSS inside of a seperate file insert the code as shown
<link href="(FILE NAME)/main.css" rel=stylesheet type="text/css">
solution2
0 2016-01-27 04:36:33
为main.css使用正确的路径制作css文件夹并将主css文件放入该文件夹并在以下路径中使用
<link href="css/main.css" rel=stylesheet type="text/css">
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.