旋轉木馬在HTML工作不

我不知道爲什麼這個代碼不工作...因爲我是一個初學者我找不到什麼錯，在此先感謝任何人誰幫助我走出旋轉木馬在HTML工作不

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Jothidhal</title> 
     <meta charset = "utf-8"> 
     <meta name = "viewport" content = "width = device-width" , initial-scale = 1> 
     <link rel = "stylesheet" type = "text/css" href = "css/bootstrap.min.css"> 
     <link rel = "stylesheet" type = "text/css" href = "additional.css"> 
     <link href="https://fonts.googleapis.com/css?family=Arsenal:700" rel="stylesheet"> 
    </head> 
    <body> 
     <div class = "container-fluid"> 
     <div id = "My_Carousel" class = "carousel-slide" data-ride = "carousel"> 
      <ol class = "carousel-indicators"> 
      <li data-target = "#My_Carousel" data-slide-to = "0" class = "active"> </li> 
      <li data-target = "#My_Carousel" data-slide-to = "1" > </li> 
      <li data-target = "#My_Carousel" data-slide-to = "2" > </li> 
      </ol> 
      <div class = "carousel-inner" role ="listbox"> 
      <div class = "item"><img src = "images/images 1.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 2.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 3.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 4.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 5.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      </div> 
      <a class = "left-carousel-control" href = "#My_Carousel" role= "button" data-slide = "prev"> 
      <span class = "glyphicon glyphicon-chevron-left"></span> 
      <span class = "sr-only">Previous</span> 
      </a> 
     </div> 
     </div> 
     <script type = "text/javascript" src = "js/bootstrap.min.js"></script> 
     <script type = "text/javascript" src = "js/jquery.js"></script> 
    </body> 
    </html>

來源

2017-02-10 Durairaj Saro

它確實有助於描述會發生什麼，而不是隻是它不工作:) –

你有什麼錯誤？ –

其實，先生，我沒有得到輸出，沒有任何圖像顯示，很困惑！ –

您的img標籤不關閉！

<div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"</div>

應該

<div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"></div>

來源

2017-02-10 08:03:54

謝謝先生，但即使關閉img標籤後，我沒有得到輸出。 –

嗯，首先，旋轉木馬和幻燈片之間應該有一個空格（'class = 「旋轉木馬幻燈片」）。然後，從你的'img'中刪除高度和寬度，並把它放在css中。圖像只支持int值，比如'height =「400」'。 –

你有你的複製粘貼&做了一些錯誤。這應該是你的HTML：

變化carousel-slide到carousel slide
添加active類的第一張幻燈片
使用正確的旋轉木馬控制的，而不是你的錯誤的。該控件的類應該left carousel-control而不是left-carousel-control
閉上你的img標籤

如果你有3個指標，您應該只有3張幻燈片

<div class="container-fluid"> 
    <div id="My_Carousel" class="carousel slide" data-ride="carousel"> 
     <ol class="carousel-indicators"> 
      <li data-target="#My_Carousel" data-slide-to="0" class="active"> </li> 
      <li data-target="#My_Carousel" data-slide-to="1" > </li> 
      <li data-target="#My_Carousel" data-slide-to="2" > </li> 
     </ol> 

     <div class = "carousel-inner" role ="listbox"> 
      <div class = "item active"><img src = "images/images 1.jpg" alt = "Durairaj" /></div> 
      <div class = "item"><img src = "images/images 2.jpg" alt = "Durairaj" /></div> 
      <div class = "item"><img src = "images/images 3.jpg" alt = "Durairaj" /></div> 
     </div> 
     <a class="left carousel-control" href="#My_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="#My_Carousel" role="button" data-slide="next"> 
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
      <span class="sr-only">Next</span> 
     </a> 
    </div> 
</div>

檢查此W3Schools tut和檢查本fiddle

如果您複製粘貼代碼，至少要做到正確..

來源

2017-02-10 09:03:48 Yuri

旋轉木馬在HTML工作不

回答

相關問題