Bootstrap 3导航栏链接应显示垂直时应为水平

按照Michael Hartl的ruby on rails教程并在将bootstrap导入custom.css.scss文件后，链接显示为一个块（垂直），当它们真的应该是水平的时，导致导航栏真的很厚，如下所示。 所以问题是我做错了什么以及如何使用boostrap使导航水平？

这是我的application.html.erb布局

     true %>  true %>     
 
 
  
 
 
 
 
 
 
 
 
 
 
 
  
   

这是我的Gemfile

 source 'https://rubygems.org' ruby '2.0.0' #ruby-gemset=railstutorial_rails_4_0 gem 'rails', '4.0.2' group :development, :test do gem 'sqlite3', '1.3.8' gem 'rspec-rails', '2.13.1' gem 'guard-rspec', '2.5.0' gem 'spork-rails', '4.0.0' gem 'guard-spork', '1.5.0' gem 'childprocess' end group :test do gem 'selenium-webdriver', '2.35.1' gem 'capybara', '2.1.0' gem 'growl', '1.0.3' end gem 'sass-rails', '4.0.1' gem 'uglifier', '2.1.1' gem 'coffee-rails', '4.0.1' gem 'jquery-rails', '3.0.4' gem 'turbolinks', '1.1.1' gem 'jbuilder', '1.0.2' gem "bootstrap-sass", "~> 3.0.3.0" group :doc do gem 'sdoc', '0.3.20', require: false end group :production do gem 'pg', '0.15.1' gem 'rails_12factor', '0.0.2' end 

Answer 1

（我没有足够的代表评论Mlennie的回答，所以这需要单独回答）

正如Mlennie所说，“添加一个navbar-nav课程终于奏效了。”

这意味着改变：

至：

Answer 2

添加navbar-nav类终于有效了。