Question

我使用Twitter引导程序并试图将导航栏的文本对齐，即 - “品牌”将出现在右侧，而其他所有内容都出现在左侧。（对于从右到左的网站）。

有关如何实现这一目标的任何想法？

Answer 1

pull-right和pull-left是默认的bootstrap类，可以帮助您实现这一点，而无需编写自己的CSS。例如，

    <div class="navbar pull-right"></div> [equivalent to float:right]
    <div class="navbar pull-left"></div>  [equivalent to float:left]

Answer 2

将float:right应用于div，其类为navbar-inner

<div class="navbar-inner" style="float:right">

喜欢

<div class="navbar">
    <div class="navbar-inner">    
        <div style="float:right">
        <a class="brand" href="#">Title</a>
        <ul class="nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        </ul>
    </div>
</div>

Live Demo

Answer 3

在bootstrap.css文件中更新这些类

.navbar .nav {
    display: block;
    float: right;
    left: 0;
    margin: 0 10px 0 0;
    position: relative;
}


.navbar .brand {
    color: #777777;
    display: block;
    float: right;
    font-size: 20px;
    font-weight: 200;
    margin-left: -20px;
    padding: 10px 20px;
    text-shadow: 0 1px 0 #FFFFFF;
}


.navbar .nav > li {
    float: right;
}

Answer 4

只改变......浮动：向右浮动：左

<div>
    <P> And here is the 789. </P>
</div>

Answer 5

更好的解决方案是更改dir代码中body的值：

<body dir="rtl">
...
</body>

Answer 6

将float：right设置为ul，类为.navbar-nav

.navbar-nav{float:right;margin:0}.navbar-nav>li{float:right}

Bootstrap - 更改导航栏的方向

6 个答案: