菜单栏移动选择整个导航栏而不是单击按钮答案

【问题标题】：Menu bar mobile select the whole navbar instead of clicking the button菜单栏移动选择整个导航栏而不是单击按钮
【发布时间】：2022-01-23 08:14:16
【问题描述】：

当我尝试在移动设备上打开菜单时，它并没有打开，而是您只需选择整个菜单栏。在实际网站上看起来是这样的：

同时，这是 navbar.php 的相关代码

<link href="assets/css/style.css" rel="stylesheet">
<nav class="navbar navbar-default">
<div class='container'>
    <div class="navbar-header">
        <button type="button" id='navbar-toggle' class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <div class="brand">
        <a href="../index"><img src="assets/img/transparentlogo.png" alt="logo"></a>
        </div>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav navbar-left">
            <li><a href="index">Home</a></li>
            <li><a href="services">Services</a></li>
            <li><a href="about">About</a></li>

            
            <li><a href="contact">Contact</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="contact" class="book">Contact Us</a></li>
        </ul>
    </div>
</div>

虽然 PHP 文件被命名为 navbar.inc.php，但不确定它是否会有所不同感谢您花时间阅读这篇文章

【问题讨论】：

标签： php html css

【解决方案1】：

<div class="brand">
    <a href="../index"><img src="assets/img/transparentlogo.png" alt="logo"></a>
</div>

也许您应该携带品牌类别的属性来锚定标签并删除品牌类别。

<a class="brand" href="../index"><img src="assets/img/transparentlogo.png" alt="logo"></a>

或者，您应该检查您的锚标记 () 是否覆盖了具有“品牌”类的 div 下的所有空间。在我看来，你不能在手机上点击它，因为 a' 并没有占据所有的宽度和高度。

【讨论】：