0

最近学习了 Bootstrap（以及一般的前端东西）并且被困在一个特定的问题上。我有一个导航栏，它可以在整个页面宽度上缩放，徽标向左对齐，然后是无序列表中 5 个项目的跟进，向右浮动。只要响应能力没有发挥作用，就可以很好地工作。输入某个最小/最大宽度时显示的一般行为 - 将列表项彼此排序 - 很棒，但是，正确的浮动在路上的某个地方丢失了. 在浏览 bootstrap-responsive.css 时，我很难找到导致此行为的行。有人知道我应该从哪里开始寻找吗？

<div class="navbar">
    <div class="navbar-inner">
        <a class="brand" href="#"><img src="img/logo.png" alt="horizontal-ad"></a>
        <ul class="nav" style="float: right;">
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
        </ul>
    </div>
</div>

除了无序列表的内联样式外，我覆盖的唯一规则是主 bootstrap.css 中的 .navbar-inner 来调整颜色。

问候！

::edit：我刚刚意识到这与 bootstrap-responsive.css 无关，因为我删除了它，但行为保持不变。但是，问题仍然存在。::

4

4 回答 4

0

html

<ul class="nav" id="nav_ul">

CSS

#nav_ul{
float:right!important;
}
于 2013-08-27T11:09:36.453 回答
0

尝试这个

<div class="navbar">
    <div class="navbar-inner clearfix">
        <a class="brand pull-left" href="#"><img src="img/logo.png" alt="horizontal-ad"></a>
        <ul class="nav pull-right">
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
            <li><img src="img/ad/adhorizontal.jpg" alt="horizontal-ad"></li>
        </ul>
    </div>
</div>
于 2013-08-27T11:16:41.703 回答
0
于 2013-08-27T11:18:09.063 回答
0

Try Boostrap helper class pull-right:

<ul class="nav pull-right">

or try to display in block:

 <ul style="display:block" class="nav pull-right">
于 2013-08-27T11:16:01.553 回答