玉模板不包括CSS

这是我的文件结构： http://i.imgur.com/XleRVbc.png 玉模板不包括CSS

里面的观点，我有了下面的代码layout.jade：

doctype 5 
html 
    head 
     title= title 
     link(rel='stylesheet', href='../bootstrap/css/bootstrap.min.css') 
     link(rel='stylesheet', href='../bootstrap/css/bootstrap-responsive.min.css') 
     script(src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js') 
     script(src='../bootstrap/js/bootstrap.min.js') 
body 
    block content

这是index.jade：

extends layout 

block content 
     div.top 
     form.form-horizontal(method="post", id="loginForm") 
      label Username 
      input.span3(id="username", type="text", name="User", placeholder="Enter your    username") 
      label Password 
      input.span3(id="password", type="password", name="Password") 
      input.btn(type="submit", value="Log In") 
div.container 
    div.content 
      table.table.table-striped 
      thead 
       tr 
       th Table 
       th Heading 
    tbody 
     tr 
     td Blah 
     td Test 
     tr 
     td Hello 
     td World

div.footer

但它看起来像CSS不g等应用，因为页面的样子：

http://i.imgur.com/8CjRlKC.png

CSS的是所谓的自举的文件夹中/ CSS

来源

2013-10-16 user2417731

这将是如果更好你提供了生成的html。但我敢打赌，你刚刚得到的CSS路径错误 – vkurchatkin

您使用的快递？如果是这样，看起来您缺少文件结构中的公用文件夹。通常你碰到这样的：

的package.json

app.js

node_modules/

| - ...

公共/

| -IMG/

| -css/

| -js/

路线/

的意见/

..和你让快递了解通过这些文件：

var app = module.exports = express(); 

... 

app.use(express.static(__dirname + '/public'));

尝试添加一行代码到App .js如果它尚未存在，创建公用文件夹，将引导文件夹移动到那里，然后通过链接（rel ='stylesheet'，href ='bootstrap/css/bootstrap.min.css'）引用它在玉石

来源

2013-10-16 22:13:28 enducat

修复它，谢谢！ – user2417731

哎呀，我没有看到我发布我的回应之前:) – Jondlm

尝试使用绝对路径而不是相对路径。相对路径可能会令人困惑，因为它们相对于app.js而不是视图。

变化

link(rel='stylesheet', href='../bootstrap/css/bootstrap.min.css') 
link(rel='stylesheet', href='../bootstrap/css/bootstrap-responsive.min.css')

要

link(rel='stylesheet', href='/bootstrap/css/bootstrap.min.css') 
link(rel='stylesheet', href='/bootstrap/css/bootstrap-responsive.min.css')

另外，还要确保你正确的服务与像你app.js下面一行静态文件：

app.use(express.static(path.join(__dirname, 'bootstrap')));

来源

2013-10-16 22:19:21 Jondlm

玉模板不包括CSS

回答

相关问题