1.簡介
Twitter-bootstrap是一個功能強大的前端web框架，使用它可以快速地開發出漂亮的web UI。而thomas-mcdonald/bootstrap-sass是rails
sass版本的bootstrap。其他類似的gem還有jlong/sass-twitter-bootstrap，metaskills/less-rails-bootstrap，seyhunak/twitter-bootstrap-rails，前一個也是sass版本，後兩個是less版本的。另外，jasny-twitter-bootstrap是bootstrap的一個很好的拓展，添加了文件上傳等漂亮的插件。
而Bootswatch是基於bootstrap的主題資源站，提供了很多收費和免費的主題，利用這些現成的主題能夠在bootstrap的基礎上更進一步加快網站開發，製作出精美的頁面。
2.安裝twitter-bootstrap
這裏推薦使用tomas-macdonald/bootstrap-sass。首先在gemfile中添加：
gem 'sass-rails', '~> 3.2'
gem 'bootstrap-sass', '~> 2.3.2.0'然後執行bundle install安裝需要的gem。
在app/assets/javascripts/application.js文件中添加需要的javascript引用：
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .將app/assets/stylesheets/application.css重命名爲app/assets/stylesheets/application.css.scss。
現在可以調整app/views/layouts/application.html.erb模板佈局，然後就可以瀏覽twitter-bootstrap網站按照example美化自己的rails站點了。
3.安裝bootswatch主題
如果還想利用bootswatch的主題，就可以使用maxim/bootswatch-rails來方便地繼承bootswatch的免費主題。
在gemfile中添加：
gem 'bootswatch-rails'然後執行bundle install安裝該gem。在application.css.scss文件中require語句後添加：
// 示例：使用bootswatch免費主題： 'Cerulean' bootswatch
// 首先導入變量
@import "bootswatch/cerulean/variables";
// 導入bootstrap
@import "bootstrap";
// 修改bootstrapbody邊距
body { padding-top: 60px; }
// 導入bootstrap Responsive styles
@import "bootstrap-responsive";
// 最後導入需要的bootswatch主題
@import "bootswatch/cerulean/bootswatch";
// 你還可以在base.css.scss文件中添加更多自定義設置
@import "base";你需要在application.css.scss文件相同目錄下創建base.css.scss文件，如果需要就在其中添加更多自定義選擇。
4.Bug fix
在rails中使用bootswatch可能導致某些css設置失效，通常的可能就是在/app/assets/stylesheets目錄下，某些css設置覆蓋了bootswatch的配置。比如，按照上述方法配置的bootswatch主題就有可能無法顯示主題背景色（body背景色始終是白色）。而rails自動產生的scaffolds.css.sass文件中就覆蓋了body的背景色配置，故而導致該bug。所以刪除scaffolds.css.scss中除.field_with_errors
和 #error_explanation 其餘內容即可。
另外，使用一些其他的rails gem也可能無法使用bootswatch的主題，比如jQuery-modal-rails，它是一個簡單的模態對話框gem，但它的對話框就是白底，無法使用bootswatch的主題配置，此時手工配置一下即可，如在需要的頁面的.css.sass文件中配置.modal
{background-color: green;}，就可以顯示綠色的模態對話框。