在Node.js和Express上的Twitter引导

如何在Node.js和Express上使用Twitter Bootstrap?

我知道我必须把CSS和Javascript文件放在./public目录下(如果它是默认的)。 但是当我查找如何在Node.js和Express上使用Twitter Bootstrap时,我知道使用Twitter Bootstrap有很多变种。

例如,只需将bootstrap CSS和JS文件放在适当的目录中,或者指定:

<link rel='stylesheet' href='assets/css/bootstrap-responsive.css'> <link rel='stylesheet' href='https://d396qusza40orc.cloudfront.net/startup%2Fcode%2Fbootstrap.js'>

还有两个来源,normal和.min.css文件,每个都有CSS和JS。 那么如何在Node.js和Express中提供相应的Bootstrap文件呢?

这是我当前代码的前几行(是否有必要?),这不适用于响应式devise(当我缩小屏幕以模仿智能手机的大小时,它不会垂直堆叠,而只是缩小尺寸每个比例是相同的)。

 <!DOCTYPE html> <html lang='en'> <head> <meta charset='utf-8'> <title><%= title %></title> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <link rel='stylesheet' href='/stylesheets/bootstrap.min.css'> <link rel='stylesheet' href='assets/css/bootstrap-responsive.css'> <script src='/javascripts/jquery-2.0.2.min.js'></script> <style type='text/css'> /* Large desktop */ @media (min-width: 980px) { body { padding-top: 60px; } } /* smartphones */ @media (max-width: 480px) { body { padding-top: 30px; } } </style> </head> 

在公共文件夹中创build一个子文件夹,并将其命名为样式表。然后将所有twiter bootstraper css文件放入该样式表文件夹中。然后,可以像下面那样链接文件。也可以按照js文件中的相同方式进行连接。

  <link rel='stylesheet' href='stylesheets/bootstrap.min.css'> <link rel='stylesheet' href='stylesheets/bootstrap-responsive.css'> <script src='javascripts/jquery-2.0.2.min.js'></script> 

创build一个类似于。\ public \ js \ lib \ bootstrap的文件夹,并在bootstrap文件夹中保存两个文件bootstrap-combined.min.css和bootstrap.js,您可以从./views/index.html页面的引导库包括那些文件

 <link href="/js/lib/bootstrap/bootstrap-combined.min.css" rel="stylesheet"> <script src="/js/lib/bootstrap/bootstrap.js"></script> 

它现在应该为你工作….