Home > Blockchain >  Link css file to ejs file
Link css file to ejs file

Time:08-27

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" >
      <h1>Store Ownership Feedback</h1>
      <div>
        <label" for="name">Problem</label>
        <input type="text" id="name" name="name" />
      </div>
      <div>
        <label for="request">Feedback</label>
        <textarea name="request" id="request" cols="30" rows="10" ></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

CodePudding user response:

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")

CodePudding user response:

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

  • Related