0

如何将 .css 文件添加到我的 node.js(非 express)代码中?我正在做一个简单的初学者代码。我尝试了以下但它不起作用:

    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;}
4

2 回答 2

2

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

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

  1. 将 css 直接嵌入到您的 html 文件中。然后将应用css。

  2. /style.css为将 css 文件内容输出到客户端的位置编写一条新路由,并保持 html 文件原样。

于 2013-09-02T09:52:16.903 回答
0

我不确定你的代码是什么样子,但你应该有这样的东西:

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/');
于 2013-09-02T09:52:54.997 回答