1

我的引导网格系统有点问题。我在页面顶部创建了自己的导航 div。对于较大的屏幕尺寸,这一切都很好。当我将屏幕尺寸减小到 xs 时,它会中断。这就是我的目标:

| logo | link 1 | link 2 | link 3 | link 4|

以上适用于除 xs 之外的所有屏幕。对于 xs 我得到:

| logo | link 1 |
|      | link 2 |
|      | link 3 |
|      | link 4 |

我想要的是:

| logo   |
| link 1 |
| link 2 |
| link 3 |
| link 4 |

这是我的代码:

<div class="col-xs-10 col-xs-offset-1 col-md-8 col-md-offset-2">
    <div class="row">
        <div class="col-xs-12 col-md-6">
            <a href="/"><h1 class="logo">LOGO</h1></a>
        </div>
    </div>
    <div class="row navbar navigation">
        <div class="col-xs-12 col-md-6 navLinks">
            <div class="col-xs-12 col-md-3 navLink">
                <h4 class="links"><a href="videos.html">LINK 1</a></h4>
            </div>
            <div class="col-xs-12 col-md-3 navLink">
                <h4 class="links"><a href="photos.html">LINK 2</a></h4>
            </div>
            <div class="col-xs-12 col-md-3 navLink">
                <h4 class="links"><a href="about-us.html">LINK 3</a></h4>
            </div>
            <div class="col-xs-12 col-md-3 navLink">
                <h4 class="links" id="contactLink"><a>LINK 4</a></h4>
            </div>
        </div>
    </div> 
</div>
4

1 回答 1

1

将其加载为一整行删除。来自 div class=row 导航栏的类行

删除行徽标部分的 div 行结束标记并将其放在末尾

于 2016-09-07T20:33:07.423 回答