How to Link Css Externally In Virtual Studio Code

Tags: , , ,



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. but 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? html:

<!DOCTYPE html>
<html>
    <head>
        <title>Testing VSC</title>
        <link rel='stylesheet' type='text/css' href='style.css'>
        <style>
            h1{
                color:red
            }
        </style>
    </head>
    <body>
        <h1 id='test'>HI!</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);
});

how could i link the css file properly?

EDIT: i used a wring type of server. instead of this server i used:

var express = require(‘express’);
var app = express();
app.use(express.static(‘./public’));
app.listen(8080);

i put the html and css files in public and then it worked!

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



Source: stackoverflow