将 css 文件链接到 ejs 文件

Question

如何将 CSS 文件链接到 ejs 文件，我尝试了以下解决方案，但不确定我做错了什么

.css 代码：

    body {
      background:url('img.jpg') no-repeat center center/cover;
    }

.ejs 代码：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="/CSS/stylesheet.css" type="text/css">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Feddback Form</title>
  </head>
  <body>
    
    <form action="" method="POST" class="form">
      <h1>Store Ownership Feedback</h1>
      <div>
        <label" for="name">Problem</label>
        <input type="text" id="name" name="name" class="box"/>
      </div>
      <div>
        <label for="request">Feedback</label>
        <textarea name="request" id="request" cols="30" rows="10" class="box"></textarea>
      </div>
      
      <button type="submit">Submit</button>
    </form>
      </div>
    
  </body>
</html>

.js 代码：

const express = require("express");
const { google } = require("googleapis");

const app = express();
app.set("view engine", "ejs");
app.use(express.urlencoded({ extended: true }));
app.use(express.static(__dirname+'/views'));
app.get("/", (req, res) => {
  res.render("index");
});

文件目录： .js:/public.ejs:/public/views.css:/publice/views/CSS

Answer 1

在添加此行链接之前 rel="stylesheet" href="{{asset('css/style.css')}}" type="text/css"

（您的 style.css 需要在“public<css”中）

Answer 2

一般推荐的结构是main.js文件应该在root部分，css文件应该在public部分。 下面，我分享一个示例结构，目的是它可能会有所帮助。

转发 Static：公共 static

在 header.ejs 上导入 css：导入 css 文件

将 css 文件链接到 ejs 文件

问题描述

2 个解决方案

解决方案1
-1 2022-08-26 09:38:08

解决方案2
-1 2022-08-26 09:47:05

将 css 文件链接到 ejs 文件

问题描述

2 个解决方案

解决方案1 -1 2022-08-26 09:38:08

解决方案2 -1 2022-08-26 09:47:05

解决方案1
-1 2022-08-26 09:38:08

解决方案2
-1 2022-08-26 09:47:05