Question

我使用rails 4和bootstrap 3，它有基本的类，但很多都缺少。我的宝石文件

...    
    gem "therubyracer"

    gem "less-rails" #Sprockets (what Rails 3.1 uses for its asset pipeline) supports LESS

    gem "twitter-bootstrap-rails"
...

我的application.css

 *= require bootstrap_and_overrides 
 *= require_self
 *= require_tree

我的应用程序只有表单和按钮的基本样式，但没有很多类，如 col-xs-6 col-md-4 ，所以我无法构建网格布局。

当我将示例代码从bootstrap网站放到我的视图

时

<div class="row">
  <div class="col-xs-12 col-md-8">.col-xs-12 .col-md-8</div>
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

<!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->
<div class="row">
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

<!-- Columns are always 50% wide, on mobile and desktop -->
<div class="row">
  <div class="col-xs-6">.col-xs-6</div>
  <div class="col-xs-6">.col-xs-6</div>
</div>

我有这个

.col-xs-12 .col-md-8
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6
.col-xs-6

Answer 1

如果您检查Issues的twitter-bootstrap-rails，您会看到frequently raised issue是主分支用于Bootstrap 2.3.2，即（现在不支持的）Bootstrap 2而不是Bootstrap 3.并且在README中没有明确提到这一点。您的示例网格标记来自Bootstrap 3，因此无法正常工作 - 网格系统在Bootstrap 2和Bootstrap 3之间发生了显着变化。

要完成这项工作，您必须坚持使用Bootstrap 2标记，或者试试运气Bootstrap 3 branch of twitter-bootstrap-rails。

rails bootstrap缺少类

1 个答案: