Question

我有这个网站，当您以小尺寸（手机尺寸）观看菜单时，我尝试过很多次来修复菜单。

您知道我需要更改哪个元素（或哪个CSS）吗？

这是html部分：

<nav class="navbar navbar-inverse navbar-static-top">
    <div class="container-fluid container">
        <a class="navbar-brand" href="index.php">Follow<span>My</span>Routes</a>
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>                        
            </button>

        </div>

        <div class="collapse navbar-collapse" id="myNavbar">

            <ul class="nav navbar-nav navbar-right">

                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-globe"></i>  <span id="lanNavSel">EN</span> <i class="caret"></i></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href='#' class='change_lang' data-lang='EN'> <img src='images/langs/EN.png' alt='English' class='img-thumbnail icon-small'> <span>English</span></a></li>
                        <li><a href='#' class='change_lang' data-lang='HE'> <img src='images/langs/HE.png' alt='Hebrew' class='img-thumbnail icon-small'> <span>Hebrew</span></a></li>
                    </ul>
                </li>               

                <li><a href="#" data-toggle="modal" data-target="#login"><i class="glyphicon glyphicon-log-in"></i> Login</a></li>
                <li><a href="#" data-toggle="modal" data-target="#reg"><i class="glyphicon glyphicon-user"></i> Registration</a></li>


            </ul>
        </div>
    </div>
</nav>

非常感谢

Answer 1

我相信您在320像素移动视图中的网站中存在问题。在这种情况下，请按以下步骤操作：

.navbar-brand {
 padding-left:0px;
 padding-right:0px;
}

引导程序-手机上的菜单无法正常显示

1 个答案: