页面 CSS 不会加载 - 简单的 html 和 js 文件
Posted
技术标签:
【中文标题】页面 CSS 不会加载 - 简单的 html 和 js 文件【英文标题】：Page CSS will not load - simple html and js file 【发布时间】：2018-01-14 00:39:23 【问题描述】：我正在创建一个简单的页面来开始学习 html、CSS 和 java 脚本。我的 HTML 文件带有指向我的 CSS 文件的以下链接，但由于某种原因没有加载任何 CSS。
我通过节点在本地主机上运行它。
html:
<!DOCTYPE html>
<html>
<head>
<link href='./css/styles.css' type='text/css' rel='stylesheet'>
</head>
我的 server.js 文件：
var http = require('http');
var fs = require('fs');
const PORT=8080;
fs.readFile('./index.html', function (err, html)
if (err) throw err;
http.createServer(function(request, response)
response.writeHeader(200, "Content-Type": "text/html");
response.write(html);
response.end();
).listen(PORT);
);
我也收到了错误
"资源被解释为样式表，但以 MIME 类型传输 text/html: "http://localhost:8080/css/styles.css"."
我是否需要在我的 server.js 文件中添加另一个“text/css”的内容类型？
文档树：
【问题讨论】：
您缺少一个重要的标签。节点js 感谢您添加标签，我确实错过了 :) 【参考方案1】：您可以像这样将脚本从外部添加到您的html 页面。它可能位于head 标签内，就像您的 CSS 定义一样。
<script type="text/javascript" src="../Script_folder/server.js"></script>
并且要小心访问树中的文件。 ../ 表示上一级，~/ 指向root 节点。所以，我想知道你的路由在你的 CSS 地址中有一个特定的.。
<link href='../css/styles.css' type='text/css' rel='stylesheet'>
有两个点。 ../
【讨论】：
感谢您的回复，但不幸的是它仍然没有加载我的 css。 我在正文末尾的 index.html 文件中确实有以下来源，因为我想先加载所有页面内容。 能否请您发布文档树的图像。所以我们可以看到文件和文件夹的层次结构。 添加了文档树 两者处于同一级别。<script src="server.js" /> 和 <link href='/css/styles.css' type='text/css' rel='stylesheet'> 对于index.html 应该足够了。【参考方案2】：
在 href 属性中，您只使用了一个点而不是两个。你的 href 应该是这样的
<link href='../css/styles.css' type='text/css' rel='stylesheet'>
【讨论】：
基于我的树，我认为一个点“。”有道理，因为我不想上一个目录然后到 css 文件夹。我有我的根文件夹“mySite”，其中有两个文件夹，css 和 js，在我的根目录中是我的 index.html 文件。以上是关于页面 CSS 不会加载 - 简单的 html 和 js 文件的主要内容，如果未能解决你的问题，请参考以下文章
Django - javascript不会在html页面上加载