Question

我觉得这样的问题。现在，我有rails应用程序，正常工作正常。我想添加bootstrap的圆角样式搜索框。所以我添加了

：class =＆gt; '形式的搜索'

和

：class =＆gt; 'input-medium search-query'

形成标签。

但它没有改变:(它仍然只是方盒子。为什么不改变？我怎样才能像拐角圆形搜索框一样制作它，就像在官方的bootstrap网站上一样？

让我为您提供有关我的配置的更多信息。谢谢！

在Gemfile中

gem'twitter-bootstrap-rails'

在assets / javascripts /我有'bootstrap.js.coffee'

和application.js以

开头

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .
//= require jquery.ui.datepicker

在assets / stylesheets /我有'bootstrap_and_overrides.css.less'

和application.css以

开头

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 *= require jquery.ui.datepicker
 */

Answer 1

我和你一样经历过同样的事情。

认为我发现了问题，事实证明。

在html

上添加到顶部

<!DOCTYPE html>

和

之类的表格

<form class="form-search">
  <input type="text" class="input-medium search-query">
  <button type="submit" class="btn">Search</button>
</form>

如果有这项工作，请告诉我

Answer 2

首先，确保从bootstrap项目主页下载。

第二，您需要的所有文件是：

bootstrap.css不是min版本，因为你以后会改变它。
bootstrap.min.js因为你不太愿意改变它。
您下载的img文件夹中的两个png图像文件。

第三。将它们放入资产文件夹的相关文件夹中。

第四。如果你想让图标显示出来。您必须将bootstrap.css中引用uri的图标png文件更改为当前的文件夹结构。

如何将bootstrap.css加载到我的rails3应用程序？

2 个答案: