如何使用 bootstrap3 创建具有两种颜色的导航栏

【问题标题】：How create a navbar with two colors using bootstrap3如何使用 bootstrap3 创建具有两种颜色的导航栏
【发布时间】：2013-10-29 11:47:16
【问题描述】：

如何使用 less 和 bootstrap 3 创建具有两种颜色的导航栏，如下所示：

【问题讨论】：

【解决方案1】：

您可以使用默认的引导 HTML 代码来创建导航栏。如果你不想要它们的样式，你可以删除 'navbar-default' 类。

然后你只想将<nav> 中的<ul class="nav"> 浮动到右侧，给它一个背景色并在它的前面添加一个三角形。

要制作三角形，我将为<ul class="nav"> 创建一个:before 伪元素，并使用CSS borders 创建三角形。然后负边距那个 :before 元素将它带到导航前面，然后你就走了。

我已经对 HTML 和 CSS 做了一些修改。

当然应该让你开始。

【讨论】：