6

学习rails...所以我使用bootstrap-sass gem...实际的bootstrap CSS文件在哪里?似乎有某种魔法正在将它们包括在内。如果我想调整 CSS 的属性怎么办......

4

3 回答 3

4

您正在使用许多 Rails 开发人员首选的bootstrap-sass gem 。因此 Twitter Bootstrap CSS 文件位于 gem 中(在vendor/assets/stylesheets/中)。

开发人员使用 gem 来包含 Bootstrap 文件,因为当发布新的 Bootstrap 版本时,只需更新 gem(加上 gems 是 Rails 的方式,嗯?),就可以更轻松地进行更新。bootstrap-sass gem 很受欢迎,因为 Sass 是 Rails 中样式表的默认格式。另一种方法是twitter-bootstrap-rails gem,它使用原生的 Bootstrap LESS 格式作为样式表。

使用 gem,您需要修改文件app/assets/javascripts/application.js

#app/assets/javascripts/application.js
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .

最佳做法是添加一个名为app/assets/stylesheets/bootstrap_and_overrides.css.scss的文件:

# app/assets/stylesheets/bootstrap_and_overrides.css.scss
@import "bootstrap";
body { padding-top: 60px; }
@import "bootstrap-responsive";

这显示了一个覆盖 Bootstrap 主体样式以添加填充以适应 Bootstrap 导航栏的示例。然后只需在app/assets/stylesheets/的附加文件中添加特定于应用程序的 CSS(或 Sass)。

我写了一篇深入的文章:

Twitter Bootstrap 和 Rails

更详细地介绍了如何为 Twitter Bootstrap 设置应用程序布局、导航链接、Rails 闪存消息和表单构建器。如果您想了解更多,这篇文章可能会有所帮助。

于 2013-08-08T13:36:56.750 回答
3

不幸的是,如果您使用 gem,css 文件对您是隐藏的。如果您这样做,bundle show bootstrap-sass您将看到 gem 的文件在哪里,并且您可以看到其中使用的样式表。

如果您查看 gem 的文件,您会看到vendor/assets/stylesheets/.

我建议不要使用 gem,而是获取自己的 Bootstrap 样式表并将它们放入应用程序的vendor/assets/stylesheets/.

于 2013-08-08T12:38:15.233 回答
1

CSS 文件位于 gem 中。要将它们包含在您的应用程序中,

app/assets/stylesheets/您可以创建您选择的文件。(我称之为 bootstrap_overrides.css.scss)

并包括引导源和覆盖。

@include "bootstrap"; 

/* here are the overrides if you want to override the styles */

@include "bootstrap-responsive";

并确保它bootstrap_overrides.css.scss包含在您的全局application.css文件中。

于 2013-08-08T12:38:31.623 回答