我试图找出为什么当我使用移动设备或将屏幕调整为小尺寸时,当您按下切换按钮时,链接出现但没有背景颜色吗?
我正在使用引导程序,对如何解决此问题有任何想法吗?
如果您想亲自看看,请访问https://www.makeyourweb.co.uk/
我脑海中的代码是:
<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>
我的导航条形码是
<!-- 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>
如果您能提供帮助,那将非常感谢!
答案 0 :(得分:0)
为什么不尝试在CSS中为其赋予背景色
.navbar-collapse {
background: #444;
}
答案 1 :(得分:0)
您尝试过类似的事情吗?
public class MyBeacon extends Beacon implements Serializable, Comparable {
public String btAddress;
public String area;
public double[] position;
private static Map<String, String> btToArea = new HashMap<>();
private static Map<String, double[]> positionsMap = new HashMap<>();
static {
btToArea.put("DE:FD:0A:11:D8:80", "DEV OFFICE");
btToArea.put("D1:75:7B:58:54:D6", "DEV OFFICE");
btToArea.put("D6:81:6A:D5:09:40", "CENTRAL OFFICE");
btToArea.put("F1:14:DC:C2:0C:08", "CENTRAL OFFICE");
btToArea.put("FC:0D:4A:C1:CD:57", "DEV OFFICE");
positionsMap.put("D6:81:6A:D5:09:40", new double[]{9.9, 3.9}); //
positionsMap.put("FC:0D:4A:C1:CD:57", new double[]{0.0, 0.0}); //
positionsMap.put("D1:75:7B:58:54:D6", new double[]{0.0, 2.5}); //
positionsMap.put("F1:14:DC:C2:0C:08", new double[]{6.9, -1.0}); //
positionsMap.put("DE:FD:0A:11:D8:80", new double[]{-0.4, 2.5});
}
public MyBeacon(Beacon beacon){
super(beacon);
this.btAddress = beacon.getBluetoothAddress();
this.area = btToArea.getOrDefault(beacon.getBluetoothAddress(), "ERROR");
this.position = positionsMap.get(beacon.getBluetoothAddress());
}
public static MyBeacon FromBeacon(Beacon beacon){
if (positionsMap.containsKey(beacon.getBluetoothAddress()))
return new MyBeacon(beacon);
return null;
}
@Override
public boolean equals(Object o) {
if (this == o) return true;
if (o == null || getClass() != o.getClass()) return false;
if (!super.equals(o)) return false;
MyBeacon myBeacon = (MyBeacon) o;
return Objects.equals(btAddress, myBeacon.btAddress) &&
Objects.equals(area, myBeacon.area) &&
Arrays.equals(position, myBeacon.position);
}
@Override
public int hashCode() {
int result = Objects.hash(super.hashCode(), btAddress, area);
result = 31 * result + Arrays.hashCode(position);
return result;
}
@Override
public int compareTo(Object o) {
return (int) (((MyBeacon) o).getDistance() - this.getDistance());
}
如果需要,您可以添加div.navbar-collapse{
background: "your color";
}
来粉碎预定义的引导样式...
!important