Bootstrap 如何实现导航栏菜单文字居中

问题来源：

今天用Bootstrap练习仿站时，发现目标站导航栏的菜单是居中排版方式，而Bootstrap貌似没有导航菜单居中的样式，着实折腾了很久，多次测试终于找到了解决方法，如下：

前后对比：

原始导航栏菜单.png

修改后的导航栏菜单.png

解决方法：

问题代码

        

            

                

                    
首页 
                    
Lumen 
                    
问答社区 
                    
中文文档 
                    
下载离线文档 
                    
API 
                    
PHP中文手册 
                    
Composer
                
            
        
    
/*原始CSS*/
.navbar-nav {
    float: left;
    margin: 0;
}
.navbar-nav > li {
    float: left;
}

修改方法：
1.去掉.navbar-nav和li的左浮动样式(float:none);
2.为.navbar-nav设置文字居中样式(text-align:center);
3.将li转为内连块(display:inline-block);

修改后的代码：

        

            

                

                    
首页 
                    
Lumen 
                    
问答社区 
                    
中文文档 
                    
下载离线文档 
                    
API 
                    
PHP中文手册 
                    
Composer
                
            
        
    
/*原始CSS*/
.navbar-default .navbar-nav{
    text-align: center;
    float: none;
}

.navbar-default .navbar-nav li{
    display: inline-block;
    float: none;
}