How to Link Css Externally In Virtual Studio Code

I am using VS code to make a website and it says Hello World! I am trying to use <link rel='stylesheet type='text/css' href='style.css'>. Except it is not linking correctly. In the css file I have h1{color:red;} but the h1 is not red. If I put the style tag inside the HTML file it does work. How would I link the css code externally?

<!DOCTYPE html>
<html>
    <head>
        <title>Testing VS Code</title>
        <link rel='stylesheet' type='text/css' href='style.css'>
    </head>
    <body>
        <h1 id='test'>Hello World!</h1>
    </body>
</html>

JavaScript
​x
 
<!DOCTYPE html>
<html>
    <head>
        <title>Testing VS Code</title>
        <link rel='stylesheet' type='text/css' href='style.css'>
    </head>
    <body>
        <h1 id='test'>Hello World!</h1>
    </body>
</html>
​

//node.js server: 
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);
});

JavaScript
 
//node.js server: 
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);
});
​

How could I link the css file properly?

Answer

you need to adjust your css file path if your style.css is in css folder in same directory you need to <link rel="stylesheet" href="./css/style.css"> if you’re using windows you can simply click ctrl and hreflink, it’ll show you if path exist in that directory

Advertisement

Answer