我在将我的 css 文件连接到我的 ejs 文件时遇到问题。我想我有标准的 node.js/express 设置。我正在尝试将位于我的 public/css 目录中的 main.css 文件连接到位于我的 View 中的 index.ejs 文件。 html 和路由工作正常。这是我的 app.js 代码。
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var users = require('./routes/users');
var contact = require('./routes/contact');
var register_form = require('./routes/register');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
在我的 index.ejs 文件中，我在 head 标签之间插入了链接。我已经三重检查以确保所有文件名都是正确的。
<head>
<title><%= title %></title>
<link type="text/css" rel='stylesheet' href='../public/css/main.css' />
</head>
最佳答案
在 app.js 中，您已经定义了静态文件的位置(正如您应该的那样):app.use(express.static(path.join(__dirname, 'public'))); .这允许您使用从 public 开始的绝对路径来引用静态文件，例如 css。目录。
因此将链接行更改为
<link type="text/css" rel='stylesheet' href='/css/main.css' />它应该工作。
最好使用这种“绝对”路径，因为它允许您在不破坏 css 链接的情况下移动模板页面(例如移动 views/index.ejs -> views/pages/index.ejs
关于html - 为什么我不能将我的 css 链接到我的 ejs 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44642090/