Question

每当我将页面大小调整到600 px以下时，我的Bootstrap导航栏链接（包括搜索）就会消失。这是什么原因？只有徽标不会移动。导航栏很好，没有调整大小，所以当页面调整大小时，链接消失后，我感到很惊讶。不管页面大小调整，我都不希望我的任何链接从它们的位置移动。

代码在这里：HTML

http://jsfiddle.net/Crisp3333/2u0tgh5r/

<div class="menubar">
<nav role="navigation" class="navbar navbar-default">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a href="#" class="navbar-brand"><img src="yancii_logo.jpg" width="40px" height="50px"></a>
    </div>
    <!-- Collection of nav links, forms, and other content for toggling -->
    <div id="navbarCollapse" class="collapse navbar-collapse">
    <form role="search" class="navbar-form navbar-left">
            <div class="form-group">
                <input type="text" placeholder="Search events, places, contacts......" class="form-control">
            </div>
        </form>
        <ul class="nav navbar-nav">

            <li><a href="#">CreateEvent</a></li>
            <li><a href="#">MyEvents</a></li>
            <li><a href="#">Contacts</a></li>
            <li class="dropdown">
                <a data-toggle="dropdown" class="dropdown-toggle" href="#">Messages <b class="caret"></b></a>
                <ul role="menu" class="dropdown-menu">
                    <li><a href="#">Inbox</a></li>
                    <li><a href="#">Drafts</a></li>
                    <li><a href="#">Sent Items</a></li>
                    <li class="divider"></li>
                    <li><a href="#">Trash</a></li>
                </ul>
            </li>
        </ul>

        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">Account</a></li>
        </ul>
    </div>
</nav>

Answer 1

问题在于这段代码：/* min-width: 1400px; */ 您可以在class -> .navbar

中找到它

它基本上会导致您的下拉菜单无法显示。并且菜单按钮不会按照您的要求调整大小。

希望这会帮助你！干杯

twitter页面调整大小时，Bootstrap导航栏链接会移动

1 个答案: