Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/416.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 引导moblile菜单切换背景色不工作_Javascript_Html_Jquery_Css_Bootstrap 4 - Fatal编程技术网

Javascript 引导moblile菜单切换背景色不工作

Javascript 引导moblile菜单切换背景色不工作,javascript,html,jquery,css,bootstrap-4,Javascript,Html,Jquery,Css,Bootstrap 4,我试图找出为什么当我使用moblile设备或将屏幕调整为小屏幕时,当你按下切换按钮时,链接出现但没有背景色 我用的是bootstrap,你知道怎么解决吗 如果您想亲自参观,请访问 我脑海中的代码是: <head> <script data-ad-client="ca-pub-1761720526329589" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle

我试图找出为什么当我使用moblile设备或将屏幕调整为小屏幕时,当你按下切换按钮时,链接出现但没有背景色

我用的是bootstrap,你知道怎么解决吗

如果您想亲自参观,请访问

我脑海中的代码是:

<head>
<script data-ad-client="ca-pub-1761720526329589" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>


    <!-- Required meta tags -->
    <link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap" rel="stylesheet">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
  <script src="lib/typed.js" type="text/javascript"></script>
  <script src="assets/demos.js"></script>
  <link href="assets/demos.css" rel="stylesheet"/>
  <link href="assets/css/contan.css" rel="stylesheet"/>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    
    <!-- CSS only -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">

<!-- JS, Popper.js, and jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-175922448-1"></script>
    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-175922448-1');
    </script>

<meta name="description" content="We offer innovate and agile website solutions to local businesses to allow them to have a professional web presence. We offer flexible and bespoke solutions!">

    <!-- Bootstrap CSS -->

    <link rel="stylesheet" href="./assests/css/linearicons.css" />
    <link rel="shortcut icon" href="./assets\img\icons\favicon.ico" />
    <link rel="stylesheet" href="./assets/css/animate.css" />
    <link rel="canonical" href="https://makeyourweb.co.uk/">
    <link rel="stylesheet" href="./assets/css/price.css">
    <link rel="stylesheet" href="./assets/css/totop.css">
    <link rel="stylesheet" href="./assets/css/linearicons.css" />
    <link rel="stylesheet" href="./assets/css/magnific-popup.css" />
    <link rel="stylesheet" href="./assets/css/jquery-ui.css" />
    <link rel="stylesheet" href="./assets/css/nice-select.css" />
    <link rel="stylesheet" href="./assets/css/main.css" />
  <link href="./assets/img/icons/MetroUI_OS_Apple.png" rel="apple-touch-icon" />
  <link href="asset/demos.css" rel="stylesheet"/>
  <link href="lib/typed.js" rel="javascript">
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
  <script>hljs.initHighlightingOnLoad();</script>

    
<script>

var typed3 = new Typed('#typed3', {
    strings: ['standard websites', 'premium websites', 'email accounts'],
    typeSpeed: 45,
    backSpeed: 75,
    smartBackspace: true, // this is a default
    loop: true
  });

</script>

    <title>Make Your Web | Get a website today | No hidden costs</title>
</head>

window.dataLayer=window.dataLayer | |[];
函数gtag(){dataLayer.push(参数);}
gtag('js',新日期());
gtag(“配置”、“UA-175922448-1”);
hljs.initHighlightingOnLoad();
var typed3=新类型(“#typed3”{
字符串:[“标准网站”、“高级网站”、“电子邮件帐户”],
打字速度:45,
后退速度:75,
smartBackspace:true,//这是默认设置
循环:正确
});
创建您的网站|立即创建网站|无隐藏成本
我的导航条码是

<!-- navbar -->
<?php //include('database/connection.php')?>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css">
<nav class="navbar sticky-top navbar-expand-lg navbar-light bg-theam text-white">
        <div class="container">
            <a class="navbar-brand m-0 p-0" href="/">
                <img src="./assets/img/logos/logo.png" alt="picture" class="img-fluid" alt="">
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
                <ul class="navbar-nav text-uppercase ">
                    <li class="nav-item">
                        <a class="nav-link active" href="/">Home </a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="/contact">Contact Us</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="https://makeyourweb.co.uk#pricing">Pricing</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="https://makeyourweb.co.uk#services">Services</a>
                      </li>
                      <li class="nav-item pl-3">
                        <a class=" btn btn-outline-warning" href="/quote">Get a quote</a>
                      </li>

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


如果你能帮忙,那就太好了,谢谢

为什么不尝试在css中为它添加背景色

.navbar-collapse {
    background: #444;
}

为什么不尝试在css中为它添加背景色呢

.navbar-collapse {
    background: #444;
}

你试过那样的东西吗

div.navbar-collapse{
    background: "your color";
}
您可以添加一个
!重要信息
如有必要,可粉碎预定义的bootstap样式

div.navbar-collapse{
    background: "your color" !important;
}

你试过那样的东西吗

div.navbar-collapse{
    background: "your color";
}
您可以添加一个
!重要信息
如有必要,可粉碎预定义的bootstap样式

div.navbar-collapse{
    background: "your color" !important;
}

您正在使用两个Jquery。请尝试从您的头标签中删除
,然后再试。我不知道它是否有效。它仍然无效?您正在使用两个Jquery。尝试从头标签中删除
,然后再试。我不知道它是否有效。它仍然无效吗?