主要问题是它不会从幻灯片移动到幻灯片,我不知道左侧的灰色图像是什么。我需要它来移除那部分并使其从幻灯片流向幻灯片。
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="bootstrap.min.css">
<script src="bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="restaurantStyles.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<style>
body {
background-color: lightblue;
}
.footer {
background-color: white;
}
h3 {
color:red;
font-weight:bold;
font-style: italic;
}
</style>
</head>
<body>
<h1>The Melting Pot</h1>
<h4>"The Original Fondue Restaurant"</h4>
<div class="White">
<hr>
<ul class="nav nav-pills">
<li role="presentation" class="active"><a href="Home_Page_v5.html"><span class="glyphicon glyphicon-home"></a></li>
<li role="presentation"><a href="Menu_v5.html">Menu</a></li>
<li role="presentation"><a href="Contact_Us_v5.html">Contact Us</a></li>
</ul>
<hr>
</div>
<br>
<br>
<center><img src="http://www.royal-amsterdam.com/synergy/HTL00605/images_public/HTL00605/table_restaurant.jpg" style="width:400px; height:150px">
<br>
<br>
<p><align="center">The Melting Pot is the original fondue restaurant<br>where guests can enjoy several fondue cooking styles and a<br>variety of unique entrees, salads, and unforgettable desserts.</p>
<p><align="center">But we are more than just a restaurant; we are a unique<br>destination offering a dining experience unlike any other. Our<br>fondue restaurant is perfect for the everyday occasion, from a<br>night out with friends or a romantic dinner with your special<br>someone to a promotion celebration with colleagues.</p>
<p><align="center">Enjoy a wide range of seasonal and fixed menu items, and<br>you choose the way you want it all. Of course what is delicious<br>food without a selection of wines and craft beers to really make it great?</p>
<p><align="center">No matter what the occasion or how many courses you<br>choose to partake in, The Melting Pot provides an unforgettable,<br>interactive dining experience that turns moments into memories. From<br>the time the first piece of bread is dipped to when the last nibble<br>of dessert is savored, you'll have the time to discover new things<br>about people you thought you knew, and those you're getting to know.</p>
<br>
<br>
<div class="container">
<div class="col-xs-8 col-xs-offset-2">
<div class="carousel slide" id="myCarousel" data-ride="carousel">
<!--Indicator -->
<ol class="carousel-indicators">
<li class="active" data-slide-to="1" data-target="#myCarousel"></li>
<li data-slide-to="2" data-target="#myCarousel"></li>
<li data-slide-to="3" data-target="#myCarousel"></li>
</ol>
<!--Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active" id="slide1">
<img src="https://www.meltingpot.com/files/2777/slider-locations.jpg">
<div class="carousel-caption">
<h3>We're opening a new location!</h3>
</div><!-- end carousel -caption-->
</div><!-- end item-->
<div class="item" id="slide2">
<img src="http://1u88jj3r4db2x4txp44yqfj1.wpengine.netdna-cdn.com/wp-content/uploads/2014/12/four-seasons-930x781.jpg">
<div class="carousel-caption">
<h3>We're rolling out our seasonal menu, with special options for this season.</h3>
</div><!-- end carousel -caption-->
</div><!-- end item-->
<div class="item" id="slide3">
<img src="http://thebrooklynitesa.com/wp-content/uploads/bfi_thumb/KeepMeWild-1024x681-m9rzk18m9i79xhgr6zr0hakjc2lykcqj65upkjs034.jpg">
<div class="carousel-caption">
<h3>Web Hosting 101</h3>
</div><!-- end carousel -caption-->
</div><!-- end item-->
</div><!-- carousel-inner -->
<!-- Left and right controls -->
<a class="left carousel-control" data-slide="prev" href="#myCarousel" role="button">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div><!-- end myCarousel -->
</div><!-- end col-xs-8 -->
</div><!-- end container -->
<div class="footer">
<hr>
<div style="clear:left; padding-left:30px; color:purple; font-family:monospace">
80 S 9th St, Minneapolis, MN 55402
(612) 338-9900
</div>
<hr>
</div>
</body>
</html>
&#13;
答案 0 :(得分:0)