CODEWITHSUNDEEP
cssnode.jspug
AtmanSangeetha
AtmanSangeetha

Reputation: 425

How to refer css files in jade layout

I am trying to refer custom.css and bootstrap.min.css in jade layout which referes to views file but its not refereing.please check my code is that any problem

Jade Layout

doctype html
html
  head
  title= title
  link(rel='stylesheet', href='/stylesheets/style.css')
body
  block content

View file

extends layout

block content
  h1= title
  p Welcome to #{title}

style.css

body {
 padding: 50px;
 font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
 background: #666;

}

p {
 color: #00B7FF;

}

Upvotes: 0

Views: 178

Answers (1)

ibocon
ibocon

Reputation: 1494

doctype html
    html
        head
            title= title
            link(rel="stylesheet" href="/stylesheets/style.css")


<!doctype html>
    <html>
        <head>
            <title> title </title>
            <link rel="stylesheet" href="/stylesheets/style.css" />
        </head>
   </html>

this is a basic code for jade.
However, your code is like

doctype html
    html
      head
      title= title
      link(rel="stylesheet" href="/stylesheets/style.css")

<!doctype html>
    <html>
        <head></head>
        <title> title </title>
        <link rel="stylesheet" href="/stylesheets/style.css" />
   </html>

As you can see link is outside of head tag!
indentation for jade is important in order to reder jade into HTML5.

If you correctly indent your code than you should check your public folder dir path in app.js.

Upvotes: 1

Related Questions