如何在 github 托管站点中将我的 CSS 链接到我的 HTML答案

【问题标题】：How to link my CSS to my HTML in a github hosted site如何在 github 托管站点中将我的 CSS 链接到我的 HTML
【发布时间】：2019-06-04 13:26:54
【问题描述】：

我的问题是我尝试使用 Github 页面托管的网站不会读取我链接到它的 CSS。

我的 HTML 如下所示：

<!DOCTYPE html>
<link rel="stylesheet" type="text/css" href="https://github.com/legoman8304/legoman8304.github.io/blob/master/style.css">
<html>
    <body>
        <h1>Hello World</h1>
        <p>I'm under construction!</p>
        <h6>Copyright MIT Licence 2018</h6>
    </body>
</html>

我的 CSS 如下所示：

body {
  background-color: lightblue;
}

h6 {
  color: navy;
  margin-left: 20px;
}

链接库：legoman8304.github.io

我猜我把 CSS 链接错了，因为当我在网站本身上使用检查元素时，它确实显示 style.css，但打开时它是空的。有什么帮助吗？

【问题讨论】：

github.com/legoman8304/legoman8304.github.io/blob/master/… 不存在。它会导致 404 错误。
哦，让我把它改成私密...
现已公开
检查下面发布的答案。
你的 html 代码是错误的，你的链接标签应该在标签内，所有内容都嵌套在 html 标签内，你应该从修复它开始。

标签： html css github hosting github-pages

【解决方案1】：

您需要将您的 HTML 链接到呈现为 style.css 的 github 页面，而不是 repo 中的文件本身。

改变这个：

<link rel="stylesheet" type="text/css" href="https://github.com/legoman8304/legoman8304.github.io/blob/master/style.css">

到这里：

<link rel="stylesheet" type="text/css" href="https://legoman8304.github.io/style.css">

然后将该样式表引用移动到您的 <head> 标记内。

【讨论】：

几乎成功了，但出现了一个新错误：Refused to apply style from 'https://raw.githubusercontent.com/legoman8304/legoman8304.github.io/master/style.css' because its MIME type ('text/plain') is not a supported stylesheet MIME type, and strict MIME checking is enabled. 并且 style.css 不再出现在源代码中
嗯。坚持，稍等。我会尝试在我自己的 GitHub 中摆弄一些文件。
@WyattNulton 所以我认为这个问题不再与代码或 GitHub 相关，而是与浏览器相关，如下所示：stackoverflow.com/questions/39228657/…
真不幸。内联/内部 CSS 会是可行的方法吗？
等等。我想到了。只需将上面的链接替换为：<link rel="stylesheet" type="text/css" href="https://legoman8304.github.io/style.css"> 即可。

【解决方案2】：

你可以使用一些方法：

推荐：<link type="text/css" rel="stylesheet" href="style.css" />
使用带有 href 的原始 css：https://raw.githubusercontent.com/legoman8304/legoman8304.github.io/master/style.css

【讨论】：