我的Rails应用程序中的Bootstrap CSS在哪里?

sli*_*000 6 ruby-on-rails ruby-on-rails-3 twitter-bootstrap

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

Dan*_*hoe 4

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

开发人员使用 gem 来包含 Bootstrap 文件,因为当新的 Bootstrap 版本发布时,只需更新 gem(加上 gem 是 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 .
Run Code Online (Sandbox Code Playgroud)

最佳实践是添加名为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";
Run Code Online (Sandbox Code Playgroud)

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

我写过一篇有深度的文章:

Twitter Bootstrap 和 Rails

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