Question

我已经开始使用Bootstrap制作一个简单的网站了。一切正常，但因为我将我的徽标放在导航栏标题中，当按照407px（407由于徽标大小）时，按钮确实非常时髦。

目前，它是这样的（＆gt; 407px宽）： http://imgur.com/SIGRNqm,jH9zJji,Kwvbv98#0

当低于407时，它看起来像这样： http://imgur.com/SIGRNqm,jH9zJji,Kwvbv98#1

我希望它看起来像这样：（单击上一个链接，将＃1替换为＃2，“我没有足够的声誉......”）

我将如何做到这一点？

谢谢！如果您想了解更多详情，请与我们联系。 -Jack

编辑：这是构成完整标题的代码：

<div class="navbar-header" id="header">
                    <a href="//www.itsthejackpot.net" class="navbar-brand" id="logo"><img src="/images/itsthejackpot.png" alt="itsthejackpot.net"></a>
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mainNavBar" id="button">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div>

我见过很多人抱怨在span中使用button，但它运作正常。

Answer 1

可能不是最好的方法，但你可以暂时使用它：

@media only screen and (max-width : 480px) {
    #logo, #logo img {
        width: 230px;
        margin-top: 3px;
        height: 30px;
    }
}

Bootstrap：在媒体查询中拉伸导航栏切换按钮

1 个答案: