Bootstrap导航栏从左到右[重复]

This question already has an answer here:

这个问题在这里已有答案:

Right to Left support for Twitter Bootstrap 3 9 answers

从右到左支持Twitter Bootstrap 3 9答案

It may be stupid but I do not have any idea how to make bootstrap navbar from right to left, I'm creating an arabic website, so i want to have 'home' nav from the right .

这可能是愚蠢的,但我不知道如何从右到左制作引导导航栏,我正在创建一个阿拉伯网站,所以我想从右边有'home'导航。

here is my code :

这是我的代码:

<div class="navbar-collapse collapse">
                <ul class="nav navbar-nav navbar-right">
                    <li class="current"><a href="#home">Home</a></li>
                    <li><a href="#about">About</a></li>
                    <li><a href="#our-menu">Menu</a></li>
                    <li><a href="#contact">Contact</a></li>
                </ul>
</div>

I tried pull righ and dir=ltr but it does not work Thanks in advance .

我尝试拉righ和dir = ltr但它不起作用提前谢谢。

3 个解决方案

#1

The li are floated left by default.

默认情况下,li左侧浮动。

Just change that to float:right

只需将其改为浮动:对

.navbar-nav>li {
    float: right
}

Codepen Demo

#2

There is a library for this http://cdnjs.com/libraries/bootstrap-rtl

这个http://cdnjs.com/libraries/bootstrap-rtl有一个库

I found this by googling "bootstrap right to left language" and it took me here Right to Left support for Twitter Bootstrap 3

我通过谷歌搜索“从右到左语言引导”发现了这一点,它带我到这里从右到左支持Twitter Bootstrap 3

#3

You simply need to add the following CSS code inside your navbar's ul element.

您只需在导航栏的ul元素中添加以下CSS代码即可。

ul.nav {
    direction: rtl;
}

Example here: http://jsfiddle.net/fs9fafjq/

示例:http://jsfiddle.net/fs9fafjq/

#1