Javascript 引导3导航栏元素未正确对齐
当我在本地运行我的网站时,元素正确对齐。这是预期的结果:Javascript 引导3导航栏元素未正确对齐,javascript,html,css,twitter-bootstrap,Javascript,Html,Css,Twitter Bootstrap,当我在本地运行我的网站时,元素正确对齐。这是预期的结果: 但是,在我的上,元素是向左对齐的。我已经尝试过了,但仍然是一样的。我不明白的是为什么它在我的本地机器上工作而不是在服务器上?我该如何解决这个问题? 相关HTML代码: <section id="header" class="appear"> <div class="navbar navbar-fixed-top" role="navigation" data-0="line-height:100px; hei
但是,在我的上,元素是向左对齐的。
我已经尝试过了,但仍然是一样的。我不明白的是为什么它在我的本地机器上工作而不是在服务器上?我该如何解决这个问题?
相关HTML代码:
<section id="header" class="appear">
<div class="navbar navbar-fixed-top" role="navigation" data-0="line-height:100px; height:100px; background-color:rgba(0,0,0,0.3);" data-300="line-height:60px; height:60px; background-color:rgba(0,0,0,1);">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="fa fa-bars color-white"></span>
</button>
<h1><a class="navbar-brand" href="index.html" data-0="line-height:90px;" data-300="line-height:50px;" style="font-family: 'Cuprum', sans-serif;"> Kaushaya </a>
</h1>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav right-to-left" data-0="margin-top:20px;" data-300="margin-top:5px;">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="#section-about" >About</a></li>
<li><a href="#testimonials">Work</a></li>
<li><a href="#section-skills">Skills</a></li>
<li><a href="#section-contact">Contact</a></li>
<li><a target="_blank" href="http://www.webparadiso.wordpress.com">Blog</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
</section>
尝试使用float:right在.nav
和.navbar
上进行编码>
对于垂直基础上的额外调整,可以使用clear:both代码>打开.nav
。如果它仍然不起作用,请添加!重要信息
,在float语句末尾。一个简单的CSS解决方案为您的问题
希望这有帮助 您可以使用twitter引导nav类将其向右拉
<ul class="nav navbar-nav navbar-right">
您可以在引导站点上看到示例您是否尝试在
上添加类向右拉
。不起作用。我尝试了@ProDexorite的建议,现在它在右边,但我仍然没有得到预期的结果!应该是.navbar right
,而不是向右拉。示例ul:nav导航条nav skrollable导航条可滚动skrollable导航条之间可滚动右
嘿,我按照你的建议做了,看看我现在有什么。好在它在右边,但看起来不像预期的那样。检查我上面提供的图像!使用填充或边距对其进行调整,并通过将CSS样式化应用于.nav>li a
来更改其颜色,使其仅进入菜单链接。