jquery - 如何使导航栏变平？

Question

过去几天，我一直在使用 bootswatchr 自定义 bootstrap 3 外观，以实时查看我的更改，但是，当我的 .json 加载到 bootstrap 中时导航栏看起来不一样。

这是我想要的导航栏外观(如 BootSwatchr 中所示):

这是我将设置导入 bootstrap 后得到的结果:

我的变量:

//== Navbar
//
//##

// Basics of a navbar
@navbar-height:                    50px;
@navbar-margin-bottom:             @line-height-computed;
@navbar-border-radius:             1px;//@border-radius-base;
@navbar-padding-horizontal:        floor((@grid-gutter-width / 2));
@navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);
@navbar-collapse-max-height:       340px;

@navbar-default-color:             #777;
@navbar-default-bg:                #123D63;
@navbar-default-border:            darken(@navbar-default-bg, 6.5%);

// Navbar links
@navbar-default-link-color:                #fff;
@navbar-default-link-hover-color:          #fff;
@navbar-default-link-hover-bg:             #57B6D9;
@navbar-default-link-active-color:         #fff;
@navbar-default-link-active-bg:            #2DA4CF;//darken(@navbar-default-link-hover-bg, 6.5%);
@navbar-default-link-disabled-color:       #ccc;
@navbar-default-link-disabled-bg:          transparent;

// Navbar brand label
@navbar-default-brand-color:               @navbar-default-link-color;
@navbar-default-brand-hover-color:         darken(@navbar-default-brand-color, 6.5%);
@navbar-default-brand-hover-bg:            transparent;

// Navbar toggle
@navbar-default-toggle-hover-bg:           #ddd;
@navbar-default-toggle-icon-bar-bg:        #888;
@navbar-default-toggle-border-color:       #ddd;

为了让我的导航栏看起来像预期的那样，是否应该修改另一个属性？

我应该创建一个 CSS 文件并从那里修改它吗？

非常感谢您的帮助。

编辑:这是我的 JSFiddle http://jsfiddle.net/MgcDU/13217/

Answer 1

通过从 View 中删除不必要的 css 链接解决了问题 ...

<link href="${pageContext.request.contextPath}/resources/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet" />