所以，我试图弄清楚如何使用Bootstrap建立这个网站（请记住我是新手的引导程序），然后弄清楚如何将我的导航栏放在我的旋转木马上一切都很好，但是当我尝试添加内容时，它不会弹出，直到我添加了div标签，但是一旦我这样做，它就会上升到顶部。我通过在转盘顶部移动导航代码解决了这个问题。现在一切都按我想要的方式工作，但旋转木马不起作用。 ：/
这是我的代码。
<!DOCTYPE HTML>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Kame Computers</title>
<!-- CSS -->
<link href="C:\Users\Madcat3277\Desktop\Kame Computers\Css\bootstrap.min.css" rel="stylesheet">
<link href="C:\Users\Madcat3277\Desktop\Kame Computers\Css\bootstrap-theme.min.css" rel="stylesheet">
</head>
<header>
<!-- Styles Declare the Carousel and font. -->
<style>
.navbar {
position: absolute;
top: 30px;
z-index: 10;
width: 100%;
}
@font-face {
font-family: 'swiss_721light_condensed';
src: url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.eot');
src: url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.eot?#iefix') format('embedded-opentype'), url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.woff2') format('woff2'), url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.woff') format('woff'), url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.ttf') format('truetype'), url('C:/Users/Madcat3277/Desktop/Kame Computers/Fonts/swiss721light-webfont.svg#swiss_721light_condensed') format('svg');
font-weight: normal;
font-style: normal;
}
</style>
<!-- End of Harry Styles. -->
<font size="4" face="swiss_721light_condensed">
</header>
<!-- Anything goes. -->
<body>
<!-- Start of the Navbar -->
<nav class="navbar navbar-clear">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Brand</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-right" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</nav>
</div> <!--End Nav -->
<div id="Carousel" class="carousel slide">
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item ad1">
<img src="https://bobingao.files.wordpress.com/2012/01/green_bird_sitting_on_tree_branch-wide.jpg">
</div>
<div class="item ad2">
<img src="https://bobingao.files.wordpress.com/2012/01/green_bird_sitting_on_tree_branch-wide.jpg">
</div>
<div class="item ad3">
<img src="https://bobingao.files.wordpress.com/2012/01/green_bird_sitting_on_tree_branch-wide.jpg">
</div>
</div>
<!-- Carousel nav -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<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>
<div class="container marketing">
<!-- Three columns of text below the carousel -->
<div class="row">
<div class="span4">
<img class="img-circle" data-src="http://placehold.it/140/">
<h2>Heading</h2>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<p><a class="btn" href="#">View details »</a></p>
</div><!-- /.span4 -->
<div class="span4">
<img class="img-circle" data-src="http://placehold.it/140/">
<h2>Heading</h2>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
<p><a class="btn" href="#">View details »</a></p>
</div><!-- /.span4 -->
<div class="span4">
<img class="img-circle" data-src="http://placehold.it/140/">
<h2>Heading</h2>
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
<p><a class="btn" href="#">View details »</a></p>
</div><!-- /.span4 -->
</div><!-- /.row -->
<hr class="featurette-divider">
<div class="featurette">
<img class="featurette-image pull-right" src="http://getbootstrap.com/assets/img/examples/browser-icon-chrome.png">
<h2 class="featurette-heading">First featurette headling. <span class="muted">It'll blow your mind.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
</body>
<script src="C:\Users\Madcat3277\Desktop\Kame Computers\JavaScript\jquery-2.1.4.min.js"></script>
<script src="C:\Users\Madcat3277\Desktop\Kame Computers\JavaScript\bootstrap.min.js"></script>
</body>
答案 0 :(得分：1)
你只是将Carousel作为旋转木马的id，在旋转木马控件中你的href链接到#myCarousel所以只需将旋转木马的id更改为myCarousel，它也应该有两个end body标签和脚本应该超过最终的身体标签，没有你没有结束html标签
答案 1 :(得分：1)
您的轮播无效，因为箭头未链接到href属性中的正确滑块ID。将属性值从#myCarousel更改为您的轮播ID #Carousel：
<a class="left carousel-control" href="#Carousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#Carousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>