Link css file to ejs file
Question
How can i link a CSS file to ejs file,I tried the below solution but not sure what i did wrong
.css code:
body {
background:url('img.jpg') no-repeat center center/cover;
}
.ejs code:
<!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 code:
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");
});
Files director: .js:/public.ejs:/public/views.css:/publice/views/CSS
2 answers
solution1
-1 2022-08-26 09:38:08
Before the add this line link rel="stylesheet" href="{{asset('css/style.css')}}" type="text/css"
(Your style.css need to be in "public<css")
solution2
-1 2022-08-26 09:47:05
The generally recommended structure is that the main.js file should be in the root section and the css files should be in the public section. Below, I am sharing an example structure with the aim that it may help.
Directory Structure: Directory Structure
Forwarding Static: public static
Importing css on header.ejs: Import css file
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.