Reputation: 383
I'm creating a simple page to start to learn HTML, CSS and java script. I have my HTML file with the following link to my CSS file but for some reason none of CSS loads.
I running this on localhost via node.
html:
<!DOCTYPE html>
<html>
<head>
<link href='./css/styles.css' type='text/css' rel='stylesheet'>
</head>
my server.js file:
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);
});
I also get the error
"Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8080/css/styles.css"."
Do I need to add another content-type for "text/css" into my server.js file?
Document tree:
Upvotes: 0
Views: 98
Reputation: 56
In href attribute you used only one dot instead of two. Your href should be like
<link href='../css/styles.css' type='text/css' rel='stylesheet'>
Upvotes: 0
Reputation: 916
You can add your scripts externally to your html
page like this. It could be located inside of the head
tags like your CSS definition.
<script type="text/javascript" src="../Script_folder/server.js"></script>
And be carefull about reaching files in the tree. ../
means one level up and ~/
points to root
node. So, I wonder that your routing has a certain point with a single .
in your CSS address.
<link href='../css/styles.css' type='text/css' rel='stylesheet'>
with two dots. ../
Upvotes: 2