大佬教程收集整理的这篇文章主要介绍了css – 无法使用class = pull-right或float：right来浮动一个twitter引导导航栏项目，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我试过使用这样的东西：
<li class="whoami pull-right"> <%= link_to ("Logged in as: " + current_user.Name),edit_user_registration_path,:id=>"Edit account"%> </li>
…但链接留下来,火焰显示“浮动：左”;
所以我试图在bootstrap_and_overrides.css.less和home.html.erb中覆盖css float,但都没有工作. Firebug表示它发现了两个css float语句,但是选择了我的引导选项.所以我被困住了,想知道如何自定义导航栏.我可能在这里做错事,但是我看不到它.
这是我的代码：
application.html.erb：
<!DOCTYPE html>
<html>
<head>
... removed to shorten the length of this post
</head>
<body>
<header>
<%= render 'layouts/navigation' %>
</header>
<div id="main" role="main">
<div class="container">
<div class="content">
<div class="row">
<div class="span12">
<%= render 'layouts/messages' %>
<%= yield %>
</div>
</div>
<footer>
</footer>
</div>
</div> <!--! end of .container -->
</div> <!--! end of #main -->
</body>
</html>
_navigation.html.erb：
<div class="container span12">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<ul class="nav">
<%= link_to "Cases",root_path,:class=>"brand"%>
<% if user_signed_in? %>
<li> <%= link_to "My Cases",cases_path %> </li>
<li> <%= link_to 'Dash',dash_path %> </li>
<% if current_user.has_role? :admin %>
<li> <%= link_to 'Admin',users_path,:id=>"Admin" %> </li>
<% end %>
<li> <%= link_to 'Logout',destroy_user_session_path,:method=>'delete',:id => "Logout" %> </li>
<li class="whoami"> <%= link_to ("Logged in as: " + current_user.Name),:id=>"Edit account"%> </li>
<% else %>
<li> <%= link_to 'Login',new_user_session_path %> </li>
<li> <%= link_to 'Sign up',new_user_registration_path %> </li>
<% end %>
</ul>
</div>
</div>
</div>
</div>
bootstrap_and_overrides.css.less：
@import "twitter/bootstrap/bootstrap"; body { padding-top: 60px; } @import "twitter/bootstrap/responsive"; // Set the correct sprite paths // ...REMOVED to shorten the length of this post // Your custom LESS stylesheets goes here // // Since bootstrap was imported above you have access to its mixins which // you may use and inherit here // // If you'd like to override bootstrap's own variables,you can do so here as well // See http://twitter.github.com/bootstrap/less.html for their names and documentation // // Example: // @linkColor: #ff0000; .whoami { float:right; }
当我加载页面时,我看到导航栏,但最后一个项目没有浮动到右侧.
而这里还有另一个屏幕截图显示了some more info.
你可以看到,firebug发现了一个“float：right;”选项,但表示“float：left;”选项被替代.
我在这里的理解有差距,但我不知道在哪里.
请回覆：
>使用pull-right和twitter bootstrap navbar格式化
>覆盖css
>解释firebug输出
编辑：
我已经发布了我的第一个jsfiddle在这里：http://jsfiddle.net/uCHQs/2/
它表示浏览器“显示源”的复制/粘贴,我收集的是相关的css加载并由rails提供.
提前致谢！
使其正常工作需要使用多个无序的导航元素列表填充嵌套在Navbar-inner中的容器.这个jsfiddle向我显示了http://jsfiddle.net/N6vGZ/4/的方式
此代码工作原理：
<div class="container span12">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<%= link_to "Cases",:class=>"brand"%>
<ul class="nav">
<% if user_signed_in? %>
<li> <%= link_to "My Cases",:id => "Logout" %> </li>
</ul>
<ul class="nav pull-right"> <li> <%= link_to ("Logged in as: " + current_user.Name),:id=>"Edit account"%> </li></ul>
<% else %>
<ul class="nav">
<li> <%= link_to 'Login',new_user_registration_path %> </li>
</ul>
<% end %>
</ul>
</div>
</div>
</div>
</div>
以上是大佬教程为你收集整理的css – 无法使用class = pull-right或float：right来浮动一个twitter引导导航栏项目全部内容，希望文章能够帮你解决css – 无法使用class = pull-right或float：right来浮动一个twitter引导导航栏项目所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。