Twitter Bootstrap 2：如何向 Rails 资产管道添加响应性（ness）答案

【问题标题】：Twitter Bootstrap 2: how to add responsive(ness) to Rails asset pipelineTwitter Bootstrap 2：如何向 Rails 资产管道添加响应性（ness）
【发布时间】：2012-09-20 02:34:58
【问题描述】：

使用 Twitter Bootstrap 美化了我的 Rails 应用程序，但我想我错过了如何将 Bootstrap's responsive behavior 添加到 资产管道。

目前，当我拉伸窗口时，它不会增长（或缩小，就此而言）。

我已经在<head>中添加了视口元数据：

<meta content='width=device-width, initial-scale=1.0' name='viewport'>

但是，不太确定如何或在何处添加样式表：

<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

【问题讨论】：

您是使用像素还是百分比来设置布局宽度？当我们第一次设置我们的网站时，我们使用像素开始，因为它更容易，后来不得不将它们全部搜索并交换为百分比。
我们添加的唯一“宽度”是通过 .span 和 .offset 类。

标签： ruby-on-rails twitter-bootstrap asset-pipeline responsive-design

【解决方案1】：

找到它们，它们已经包含在 bootstrap-sass gem 中：

“根据 Bootstrap 项目，我们默认不包含响应式样式。@import "bootstrap-responsive"; 获取它们。”

【讨论】：

【解决方案2】：

您可以将文件添加到 sprocket 可以找到它的位置，例如vendors/assets/stylesheets 是一个自然的地方。取决于您在 app/assets/stylesheets/application.css 中的内容可能会这样做，但如果您没有 require_tree . 语句，那么您需要明确包含它：

/*
 ...
 *= require bootstrap-responsive.css
 */

在您的布局中，如果您有一个应该这样做的stylesheet_include_tag :application，则不必显式添加它。

【讨论】：

好的，我想我想知道它是否已经像某些 Bootstrap JavaScript 库一样包含在 bootstrap-sass 中？

【解决方案3】：

我建议使用像 https://github.com/seyhunak/twitter-bootstrap-rails 这样的 gem

【讨论】：

使用bootstrap-sass。你提到的这个可能更受欢迎有什么原因吗？
我实际上是一起使用的。我真的很喜欢我上面提到的 gem 附带的生成器。我只在我的开发环境中加载它。