Question

如何将.css文件添加到我的node.js（非快递）代码中？我做了一个简单的初学者代码。我尝试了以下但不起作用：

    function start(response) {
    console.log("Request Handler start was called");
    var body = '<html>' + 
               '<head>' +             
               '<link href="style.css" rel="stylesheet" type="text/css">' +
           '</head>' +
           '<body >' +
           '<center><h1>Hello World</h1></center>' +
           '<marquee>Welcome!!!</marquee>'+
           '<br>'+
           '<form action="/upload" method="post">' +
           '<textarea name="text" rows="8" cols="40" ></textarea>' +
           '<input type="submit" value="submit text" />' +
           '</form>' +
           '</body>' +
           '</html>';
    response.writeHead(200,{'Content-Type': 'text/html'});
    response.write(body);
    response.end();
}

和我的style.css因此：

body { margin-left : 10% ; margin-right : 10% ; margin-top: 10% ; margin-bottom : 10%; background : #D8BFD8; }
h1 { font-weight: bold;color : #8A084B;text-align: center;}
marquee { color:#305d7b; }
p {background: #acbeca; width: 700px; color: black;font-style: italic;}

Answer 1

这不会起作用，因为您尚未在节点应用中定义/style.css路由。

您可以通过两种方式解决此问题。

将css直接嵌入您的html文件中。然后css将被应用。
为/style.css编写一条新路由，将css文件内容输出到客户端并保留html文件。

Answer 2

我不确定你的代码是什么样的，但你应该有这样的东西：

var serverHTML = function(res) {
    res.writeHead(200, {'Content-Type': 'text/html'});
    var body = '<html>' + 
       '<head>' +             
       '<link href="/style.css" rel="stylesheet" type="text/css">' +
   '</head>' +
   '<body >' +
   '<center><h1>Hello World</h1></center>' +
   '<marquee>Welcome!!!</marquee>'+
   '<br>'+
   '<form action="/upload" method="post">' +
   '<textarea name="text" rows="8" cols="40" ></textarea>' +
   '<input type="submit" value="submit text" />' +
   '</form>' +
   '</body>' +
   '</html>';
    res.end(body + '\n');
}
var serveCSSData = function(res) {
    res.writeHead(200, {'Content-Type': 'text/css'});
    var css = '\
        body { margin-left : 10% ; margin-right : 10% ; margin-top: 10% ; margin-bottom : 10%; background : #D8BFD8; }\
        h1 { font-weight: bold;color : #8A084B;text-align: center;}\
        marquee { color:#305d7b; }\
        p {background: #acbeca; width: 700px; color: black;font-style: italic;}\
    ';
    res.end(css + '\n');
}
var http = require('http');
http.createServer(function (req, res) {
    switch(req.url) {
        case "/style.css": serveCSSData(res); break;
        default: serverHTML(res);
    }   
}).listen(1337, '127.0.0.1');
console.log('Server running at 127.0.0.1:1337/');

如何将css文件添加到节点js（非快速）代码中

2 个答案: