我正在使用rails 4创建一个Web应用程序,我选择了bootswatch。
我遇到了来自bootswatch(bootstrap 3)的下拉菜单。
单击时不想显示。
这是HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'>
<title>IKStudio</title>
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/bootstrap_and_overrides.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/exhibits.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/static.css?body=1" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/exhibits.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.roundabout.min.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/static.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="DZN3XrjOOv0yfuqzEZ9b8M5r7gWkkQmY1Z+VtW5Z5VY=" name="csrf-token" />
</head>
<body>
<div class='navbar navbar-default navbar-fixed-top'>
<div class='container'>
<div class='navbar-header'>
<a class="navbar-brand" href="/">TEST</a>
</div>
<div class='navbar-collapse collapse' id='navbar-main'>
<ul class='nav navbar-nav navbar-right'>
<li><a href="/test">TEST</a></li>
<li class='dropdown'>
<a class='dropdown-toggle' data-toggle='dropdown' href='#'>
KOLEKCIJE
<b class='caret'></b>
</a>
<ul class='dropdown-menu'>
<li><a href="/">muski</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class='container' id='main'>
<div class='row'>
<div class='col-md-2'></div>
<div class='col-md-8'>
</div>
<div class='col-md-2'></div>
</div>
</div>
</body>
</html>
你能帮忙吗..
答案 0 :(得分:1)
您要加载资产两次。您应该只在头文件中包含application.js和application.css,并且每个文件中的树指令将自动加载资源路径中的所有其他文件。在这里,我使用的是宝石的bootstrap和jQuery。
的application.js
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require jquery.ui.all
//= require bootstrap
//= require_tree .
//= require turbolinks
application.css
*
*= require_self
*= require jquery.ui.all
*= require_tree .
*/
答案 1 :(得分:0)
我找到了解决方案。
由于我将bootswatch css代码复制到bootstrap_and_overrides.css.scss我没有删除require bootstrap,所以我不会有2个bootstraps,但似乎bootswatch代码只修改了一些东西,我需要包含主引导程序
很抱歉打扰你这件傻事。