Html 为什么我的bootstrp carousel没有显示我的图像，而且它看起来就像我在浏览器中加载它时的样子？画廊_Html_Twitter Bootstrap_Css

Html 为什么我的bootstrp carousel没有显示我的图像，而且它看起来就像我在浏览器中加载它时的样子？画廊

html twitter-bootstrap css

Html 为什么我的bootstrp carousel没有显示我的图像，而且它看起来就像我在浏览器中加载它时的样子？画廊,html,twitter-bootstrap,css,Html,Twitter Bootstrap,Css,希望你喜欢我的练习主页。这只是开始我期待着你的有益建议。我什么都愿意引导Carousal示例！试试这个我想问题出在你的js上 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" con

希望你喜欢我的练习主页。这只是开始

我期待着你的有益建议。我什么都愿意

引导Carousal示例！试试这个

我想问题出在你的js上

  <!DOCTYPE html>
  <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">
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <link rel="stylesheet" href="css/stylesheet.css">
  <title>Gallery</title>
</head>
<body>
<header id="container-fluid">
<hgroup>
<h1> <a href="index.html" title="Love Forever"><span   class="header1">True Love Endures Forever</span> </h1>
</hgroup>
</header>
<nav  class="navbar navbar-default">
 <ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="gallery.html">Gallery</a></li>
  <li><a href="About Us.html">About Us</a></li>
  <li><a href="Contact Us.html">Contact us</a></li>
</ul>
   </nav >
<section class="container-fluid">
 <article>
<!-- Half Page Image Background Carousel Header -->
  <div id="myCarousel" class="carousel slide">
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to = "0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to = "1"></li>
        <li data-target="#myCarousel" data-slide-to = "2"></li>
    <li data-target="#myCarousel" data-slide-to = "3"></li>
    <li data-target="#myCarousel" data-slide-to = "4"></li>
    <li data-target="#myCarousel" data-slide-to = "5"></li>
    </ol>
<div class="carousel-inner">
<div class="item active">
        <img src="../Images/golfin_2.jpg'" >
        <div class="carousel-caption">
              <h3>Spending quality time with my baby at miniture golf.</h3>
</div>
  </div>
<div class="item">
       <img src="../Images/pink and black_2.jpg'" >
           <div class="carousel-caption">
    <h3>Rocking pink and and black at Tyler's propasal to Mulenga.</h3>
  </div>                                
   </div>
    <div class="item">
<img src="../Images/convention foodtime_2.jpg'" >
       <div class="carousel-caption">
    <h3>Went out to eat after 1st day of convention. Its was Good!</h3>
  </div>                                
 </div>
 <div class="item">
 <img src="../Images/Wifey and Me 1_2.jpg'" >
  </div>
  <div class="carousel-caption">
    <h3>Ally and I at Tyler and Mulenga's Wedding.</h3>
  </div>
<div class="item">
<img src="../Images/truelove_2.jpg'" >
</div>
<div class="carousel-caption">
     <h3>Our fist moment in PA. First photo together</h3>
</div>
<div class="item">
   <img src="../Images/first date_2.jpg'" >
</div>
<div class="carousel-caption">
 <h3>First date out in feild service</h3>
    </div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev">
 <span class="icon-prev"></span>
</a>

<a class="carousel-control right" href="#myCarousel" data-slide="next">
    <span class="icon-next"></span>
</a>
 </div>
 </div>
 </article>
 </section>
  <footer class="footer container-fluid">
  <p>Hope you enjoy my main practice page. Its only the beginning!</p>
  </footer>
  <script        src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
  </script>
  <script src="javascript/bootstrap.min.js"></script>
 </body>
 </html>


画廊





希望你喜欢我的练习主页。这只是开始
通过更改js下面的链接，它可以很好地为我显示图像。尝试更改链接

可能找不到正确的图像，请尝试inspect element……。如何解决此问题？我使用Firefox developer edition和内置inspect element系统等开发工具查找前端错误并解决问题

<!DOCTYPE html>
  <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">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <title>Gallery</title>
</head>
<body>
<header id="container-fluid">
<hgroup>
<h1> <a href="index.html" title="Love Forever"><span   class="header1">True Love Endures Forever</span> </h1>
</hgroup>
</header>
<nav  class="navbar navbar-default">
 <ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="gallery.html">Gallery</a></li>
  <li><a href="About Us.html">About Us</a></li>
  <li><a href="Contact Us.html">Contact us</a></li>
</ul>
   </nav >
<section class="container-fluid">
 <article>
<!-- Half Page Image Background Carousel Header -->
  <div id="myCarousel" class="carousel slide">
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to = "0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to = "1"></li>
        <li data-target="#myCarousel" data-slide-to = "2"></li>
    <li data-target="#myCarousel" data-slide-to = "3"></li>
    <li data-target="#myCarousel" data-slide-to = "4"></li>
    <li data-target="#myCarousel" data-slide-to = "5"></li>
    </ol>
<div class="carousel-inner">
<div class="item active">
        <img src="http://www.ricoh-imaging.co.jp/english/r_dc/caplio/r7/img/sample_04.jpg" >
        <div class="carousel-caption">
              <h3>Spending quality time with my baby at miniture golf.</h3>
</div>
  </div>
<div class="item">
       <img src="http://www.seoghostwriter.com/wp-content/themes/thesis_151/rotator/sample-4.jpg" >
           <div class="carousel-caption">
    <h3>Rocking pink and and black at Tyler's propasal to Mulenga.</h3>
  </div>                                
   </div>
    <div class="item">
<img src="http://www.gloriana.com/sites/g/files/g2000004666/f/Sample-image10-highres.jpg" >
       <div class="carousel-caption">
    <h3>Went out to eat after 1st day of convention. Its was Good!</h3>
  </div>                                
 </div>
<div class="carousel-caption">
 <h3>First date out in feild service</h3>
    </div>
 <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>
 </article>
 </section>
  <footer class="footer container-fluid">
  <p>Hope you enjoy my main practice page. Its only the beginning!</p>
  </footer>
 </body>
 </html>

By changing the link below of the js it works fine and displays the image for me. Try changing the links