Bootstrap 4：美化手机上的导航栏下拉菜单

Question

问题

当前，我手机上的导航下拉菜单看起来不是“现代”。但是，当我使用chrome进入开发人员模式（f12）并更改为移动视图时，它显示了一个现代外观的下拉菜单。

代码

我正在使用Bootstrap 4.3.1

class Maintenance {

    public function init()
    {
        add_action( 'wp_loaded', array($this, 'maintenance_mode') );
        //add_action( 'admin_init', array($this, 'maintenance_settings') );
    }

    public function maintenance_mode()
    {
        global $pagenow;
        if( $pagenow !== 'wp-login.php' && !current_user_can('manage_options') && !is_admin() ){
            header( $_SERVER['SERVER_PROTOCOL'] . '503 Service Temporarily Unavailable', true, 503 );
            header( 'Content-Type: text/html; charset=utf-8' );
            require_once plugin_dir_path( __FILE__ ) . 'assets/maintenance.php';
        }
        die();
    }
}

问题

是否有一个使手机上的下拉菜单与chrome相同的修复程序？

由Chrome技术支持

由iPhone XS Max ios 13.3野生动物园提供支持

Answer 1

尝试删除type="button"

 <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown"
      data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Admin
      </a>
      <div class="dropdown-menu" style="background-color:#da3744" aria-labelledby="navbarDropdown">
        <a class="dropdown-item" href="./Administrator/userManagement.php">
          User Management
        </a>
        <a class="dropdown-item" href="#">
          Another action
        </a>
        <div class="dropdown-divider">
        </div>
        <a class="dropdown-item" href="#">
          Something else here
        </a>
      </div>
    </li>