鍍金池/ 問答/HTML/ ejs模板中css失效

ejs模板中css失效

css樣式丟失。應(yīng)該是路徑的問題。
訪問路徑是Request URL: http://localhost:3000/test.css
css和js是在同一個目錄的,路徑這樣寫應(yīng)該是沒有錯的。
在用html本地打開的時候樣式都還是可以出來的,但是本地運行js文件后,輸入網(wǎng)址訪問css樣式就不見了。
希望各位大??梢圆涣哔n教,謝謝大家。下面是部分代碼。

const express = require('express');
const consolidate = require('consolidate');

let server = express();

server.set('view engine' , 'ejs');
server.set('views' , './');
server.engine('html' , consolidate.ejs);

server.get('/' , (req , res) => {
  res.render('index.ejs' , {username:'eric'});
});
server.get('/about' , (req , res) => {
  res.render('about.ejs' , {username:'eric'});
});
server.get('/news' , (req , res) => {
  res.render('news.ejs' , {username:'eric'});
});
server.get('/home' , (req , res) => {
  res.render('home.ejs' , {username:'eric'});
});
server.get('/contact' , (req , res) => {
  res.render('contact.ejs' , {username:'eric'});
});

server.listen(3000);

—————————————————————————————————————————

<!DOCTYPE html>
<html>
<head>
    <title>nav</title>
    <link rel="stylesheet" type="text/css" href="test.css">
</head>
<body>
    <ul>
        <li><a href="/home">主頁</a></li>
        <li><a href="/news">新聞</a></li>
        <li><a href="/contact">聯(lián)系</a></li>
        <li><a href="/about">關(guān)于</a></li>
    </ul>
</body>
</html>

和css代碼應(yīng)該是沒關(guān)系的,所以css代碼省略。

回答
編輯回答
陌璃

最好將css文件等分開放置,比如放置在同目錄下public文件夾下。
然后利用Express托管靜態(tài)文件: app.use(express.static(__dirname+'public'));。
相應(yīng)訪問的鏈接為:href="/public/test.css"。

2018年1月15日 02:43