Bootstrap导航栏不填充窗口顶部，

我的导航栏有问题。即使在调整窗口大小时，我的链接也应该填充整个顶部。我已经使用jquery来解决问题的人，它不工作。非常感谢您的帮助。Bootstrap导航栏不填充窗口顶部，

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <link type="text/css" href="style.css" rel="stylesheet"> 
    <link type="text/css" href="bootstrap.css" rel="stylesheet"> 
    </head> 
    <body> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
    <script language="javascript" type="text/javascript"> 
    (function($){ 
    $.fn.autowidth = function() { 
     return this.each(function() {   
     $('li', this).css({'width' : (100/$('li', this).length) + '%'}) 
     }); 
    }; 
    })(jQuery); 

    $(document).ready(function(){ 
    $('nav > ul').autowidth();  
    }); 
    </script> 

<nav class="navbar navbar-custom navbar-fixed-top"> 
<div class="container"> 
    <div class="row"> 

    <ul class="col-xs-6 col-md-3"> 
    <li><a href="#">Home</a></li> 
    </ul> 

    <ul class="col-xs-6 col-md-3"> 
    <li><a href="#">The Company</a></li> 
    </ul> 

    <ul class="col-xs-6 col-md-3"> 
    <li><a href="#">Products</a></li> 
    </ul> 

    <ul class="col-xs-6 col-md-3"> 
    <li><a href="#">About us</a></li> 
    </ul> 

    </div> 
</div> 
</nav>

来源

2015-01-15 learning

你会创建一个包含bootstrap css的jsfiddle在租约？ – jbg

您的意思是您想在调整窗口大小时将四个链接保留在一行中吗？
您只需要将ul类从“col-xs-6”更改为“col-xs-3”。

你能得到关于这个CSS类在这里grid-options

来源

2015-01-15 22:49:12 snowery

这里更多的信息对您的问题的解决方案 HTML

<nav class="navbar navbar-custom navbar-fixed-top"> 
<div class="container"> 
<div class="row"> 

<ul class="col-xs-2 col-md-3 col-lg-3"> 
<li><a href="#">Home</a></li> 
</ul> 

<ul class="col-xs-4 col-md-3 col-lg-3"> 
<li><a href="#">The Company</a></li> 
</ul> 

<ul class="col-xs-3 col-md-3 col-lg-3"> 
<li><a href="#">Products</a></li> 
</ul> 

<ul class="col-xs-3 col-md-3 col-lg-3"> 
<li><a href="#">About us</a></li> 
</ul>

使用最新的引导和最新的jQuery

[演示为小提琴]（http://jsfiddle.net/rpwm57g4/“小提琴的例子）

来源

2015-01-15 22:50:09

当你扩展到1024菜单时会自动调整 –

Bootstrap导航栏不填充窗口顶部，

回答

相关问题