为什么GitHub页面不能将CSS应用到其他页面？

我通过手动创建所有页面创建了GitHub Pages/Jekyll网站。然后，我想“让我们变得很花哨”，然后我用这些工具生成了一个新的页面，它有一个很酷的主题和疯狂的CSS和东西。幸运的是，我有远见地在之前下载原始主分支的副本。为什么GitHub页面不能将CSS应用到其他页面？

该网站的基本布局是：

Home About Blog ->Blog Posts

一旦GitHub的工具有他们的发言权（和重写了我的index.html），我后清理。我将所有新的html放在我的default.html中的/ _layouts中，这样我就可以保留它作为布局，并将index.html重新定义为YAML和原本的文本。我摆脱了我之前（和穷人）在CSS上的尝试。巴姆！一个美丽的首页向我打招呼。但是，当我试图导航到About，Blog或任何博客帖子时，我所得到的只是黑白呈现的html。没有CSS，没有花哨的东西，纳达。只是我的文字和链接。

obligatory GitHub repo

我试图改变什么，可能是专门绑到主网页，但它没有做任何事情。我卡住了。

有人可以帮我确定具体是什么导致CSS不呈现？请记住，这是我第一次使用CSS。

来源

2016-09-19 David Ben Knoble

样式表链接不在正确的路径中，因此无法在您的页面中正确加载。例如在您的关于页面中，样式表链接是https://linkreincarnated.github.io/about/stylesheets/github-dark.css，它不存在。相反，您需要从https://linkreincarnated.github.io/stylesheets/github-dark.css加载样式表。

要解决此问题，您需要在样式表链接中使用标签{{site.baseurl}}从网站的基本路径加载样式表。

在您的default.html和页面https://raw.githubusercontent.com/linkReincarnated/linkReincarnated.github.io/master/_layouts/default.html，更换线以下

<link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen"> 
    <link rel="stylesheet" type="text/css" href="stylesheets/github-dark.css" media="screen"> 
    <link rel="stylesheet" type="text/css" href="stylesheets/print.css" media="print">

与

<link rel="stylesheet" type="text/css" href="{{site.baseurl}}/stylesheets/stylesheet.css" media="screen"> 
    <link rel="stylesheet" type="text/css" href="{{site.baseurl}}/stylesheets/github-dark.css" media="screen"> 
    <link rel="stylesheet" type="text/css" href="{{site.baseurl}}/stylesheets/print.css" media="print">

，并尝试重新加载。这应该从正确的路径加载样式表。

来源

2016-09-19 01:24:53 visamba

谢谢！我使用了'{{site.github.url}}'，因为这是jekyll为github推荐的，但它的功能就像一个魅力！ –

为什么GitHub页面不能将CSS应用到其他页面？

回答

相关问题