你好吗？
首先，感谢您尝试提供帮助，我知道这个问题很愚蠢，但我找不到答案，也不明白为什么它没有按预期工作。
我的机器上有以下树:
projectFolder
|__ website
|__index.html
对于这个网站，我使用的是 Bootstrap 4，但我需要使用 Bootstrap 3 中的字形图标，因此我将 Bootstrap 3 中的字形图标部分保存在 .css 中文件名为 glyphicons.css 。然后我将此文件上传到 GitHub，原始版本可用 here 。
当我尝试在 index.html 中使用它时，使用以下行导入它，它不起作用。
<link rel="stylesheet" href="https://raw.githubusercontent.com/feRpicoral/GlyphiconsBootstrap4/master/glyphicons.css" type="text/css">
尽管如此，当我下载该文件并将其添加到 projectFolder 并生成以下路径时，它工作正常，因此问题不在 .css 文件中。
projectFolder/glyphicons.css
为了导入文件，我使用了与上面相同的 <link> ，但将 "../glyphicons.css" 改为 href 。
长话短说，当使用文件的 raw 链接导入 GitHub 上托管的样式表时，它不起作用。
我做错了什么吗？
下面您可以看到 glyphicon.css 文件的相关部分以及我在 index.html 中使用的代码。请随意运行该代码片段并更好地理解我的意思。
@font-face {
font-family: 'Glyphicons Halflings';
src: url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.eot');
src: url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff') format('woff'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.glyphicon-picture:before {
content: "\e060";
}<!DOCTYPE html>
<html>
<head>
<!-- Bootstrap4 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<!-- Glyphicons File -->
<!--<link rel="stylesheet" href="../glyphicons.css" type="text/css"> WORKS (COMMENTED TO USE WITH STACKOVERFLOW SNIPPET)-->
<!-- <link rel="stylesheet" href="https://raw.githubusercontent.com/feRpicoral/GlyphiconsBootstrap4/master/glyphicons.css" type="text/css"> DOESN'T WORK-->
<title>Glyphicons Test</title>
</head>
<body>
<style type="text/css">
div {
font-size: 100px;
margin: 100px auto;
}
#text {
font-size: 20px;
display: block;
}
</style>
<div class="container bg-dark text-center text-white">
<span class="glyphicon glyphicon-picture"></span>
<span id="text">Icon is above if working</span>
</div>
</body>
</html>提前致谢，
费尔南多
最佳答案
从 this post 寻求帮助- 和gitcdn您可以创建一个可以在 HTML 中引用的链接...我删除了您加载字形图标的 css 代码，现在所有字形图标都从您的 git 链接加载；
div {
font-size: 100px;
margin: 100px auto;
}
#text {
font-size: 20px;
display: block;
}<!DOCTYPE html>
<html>
<head>
<!-- Bootstrap4 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="https://gitcdn.link/repo/feRpicoral/GlyphiconsBootstrap4/master/glyphicons.css" />
<title>Glyphicons Test</title>
</head>
<body>
<div class="container bg-dark text-center text-white">
<span class="glyphicon glyphicon-picture"></span>
<span id="text">Icon is above if working</span>
</div>
</body>
</html>关于html - 样式表未从 URL 加载(GitHub raw)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59205959/