0

我使用 bootstrap-sass gem 安装了 Twitter Bootstrap 3，就像我在所有项目中所做的一样。但是，在这个项目中，断点被错误地调用。我不能确切地知道它为我的屏幕呈现的分辨率，但它是错误的。我必须自定义将断点设置为较小的值才能使其正常工作。我使用的标准结构如下：

在我的 application.html.haml

!!!
/ paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
/[if lt IE 7 ] <html class="ie6" lang="en">
/[if IE 7 ] <html class="ie7" lang="en">
/[if IE 8 ] <html class="ie8" lang="en">
/ [if (gte IE 9)|!(IE)]><!

%html{:lang => "en"}
  / <![endif]

  %head
    %meta{:charset => "utf-8"}/
    / Uncomment to make IE8 render like IE7
    / <meta http-equiv="X-UA-Compatible" content="IE=7" />
    / Set the viewport width to device width for mobile
    %meta{:content => "width=device-width, initial-scale=1.0", :name => "viewport"}/
    %title= full_title(yield(:title))
    = stylesheet_link_tag "application", 'http://fonts.googleapis.com/css?family=Lato:300|Grand+Hotel'
    = csrf_meta_tags


  / |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||


  %body
    .navigation
      = render 'layouts/nav'
    .wrapper
      .flash
        - flash.each do |key, value|
          %div{:class => "alert-box alert-#{key}"}= value
      = yield
      = javascript_include_tag "application"
    .footer
      / = render 'layouts/footer'
      = debug(params) if Rails.env.development?

然后我调用每个特定页面上的引导类（因为我想使用完整的背景和偏移的文本），如下所示：

主页.html.haml

#textbox
    .row
        .col-xs-12.col-sm-12.col-md-10.col-lg-10.col-md-offset-1.col-lg-offset-1
             content goes here

您可以使用此工具将我的 haml 转换为 erb：http ://www.haml-converter.com/ 。除此之外，我真的不知道还能做什么。也许是因为我使用 @import "bootstrap" 调用引导程序；在 application.css.scss 中？我尝试使用 *= require 这样做，但在 git repo 上我被警告不要这样做。此外，当我这样做时，没有加载谷歌字体。最后，提到当我最初创建项目时，我遇到了引导程序问题，其中 .row 在窗口的最大宽度上每边流动约 15 像素，这可能会有所帮助。我通过将 .row 的左右边距设置为 0 来解决此问题。

提前感谢您的帮助，祝您一切顺利！

4

1 回答 1

1

Bootstrap 使用了一个很棒的 GRID SYSTEM，它构成了应用程序的主干。如果您使用的是引导程序，那么它是必须阅读的！参考这些

http://getbootstrap.com/css/#grid

http://blog.jetstrap.com/2013/08/bootstrap-3-grids-explained/

Bootstrap 3.0 网格解释

/请删除每行前面不需要的。我认为您使用在线转换器将初始 erb 代码转换为 haml，这就是为什么所有这些都弹出的原因。

在 HAML 中，缩进就是一切。您可以在此处浏览文档

http://haml.info/docs.html

确保你首先清理了缩进不佳的代码，有人肯定会帮助你。

于 2014-02-20T06:08:22.763 回答