由于某种原因，当我对此进行编码时，它会显示为2张图像，并且它们不可单击。我正在尝试创建灯箱图片库，但是我的代码因某种原因关闭了。在我的网站的其他内容中，css中有很多随机的内容，但是如果您发现错误，请告诉我。
.stripe {
background-color: #79EBC6;
height: 100%;
width: 100%;
}
.navbar {
margin: 0;
right: 0;
position: fixed;
z-index: 999;
background-color: #58E4B3;
width: 100%;
color: white;
}
.navbar a {
color: white;
background-color: #58E4B3;
}
.nav li {
float:left;
}
.centered {
text-align: center;
}
.text {
padding: 1rem;
}
.card {
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
transition: 0.3s;
text-align: left;
flex: 0 1 32%;
}
.cards {
margin-top: 5em;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 15rem;
}
.collapse {
margin-left: 15px;
}
.jumbotron {
width: 50%;
margin: auto;
background-color: #79EBC6;
}
.carousel {
height: 25%;
width: 50%;
margin: auto;
padding: 2em;
}
.tab-pane {
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
transition: 0.3s;
background-color: white;
}
.display-4 {
text-align: center;
}
.fa-check {
font-size: 1.25rem;
padding: 1.5rem;
}
.d-flex {
text-align: center;
margin: auto;
}
.section {
padding: 3rem 0;
}
.form-row {
text-align: left;
}
.modal-body {
text-align: left;
}
.btn-button1 {
width: 100%;
background-color: #58E4B3;
}
.card-body {
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
transition: 0.3s;
background-color: white;
text-align: left;
}
.card-body .btn-success {
margin-left: .5em;
}
body {
font-family: "Asap", sans-serif;
margin:10px;
font-size:16px;
}
#demo {
height:100%;
position:relative;
overflow:hidden;
}
.green{
background-color:#6fb936;
}
.thumb{
margin-bottom: 30px;
}
.page-top{
margin-top:85px;
}<!DOCTYPE html>
<html lang="en">
<!-- Required meta tags -->
<meta charset="utf-8">
<title>Bootstrap 4.2</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.css">
<!-- Your Custom CSS -->
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/lightbox.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<h2 class="mb-5 text-center">Photo Gallery</h2>
<div class="container">
<div class="row">
<div class="row text-center text-lg-left align-items-end">
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 thumb">
<a href="images/150.png" data-toggle="lightbox" data-title="Caption">
<img src="images/150.png" class="zoom img-fluid " alt="">
<img class="img-fluid img-thumbnail" src="images/150.png" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut"
crossorigin="anonymous"></script>
<script src="https://cdnjs.com/libraries/ekko-lightbox"></script>
<script type="text/javascript" src="plugin/jrate/jquery/jRating.jquery.js"></script>
<script type="text/javascript" src="js/smooth-scroll.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</div>
</body>
</html>
这是我正在上一堂课的大作业所需要的最后几件事，因此，我们将不胜感激。