Html 我的图像不会显示在引导转盘上_Html_Bootstrap 4

Html 我的图像不会显示在引导转盘上

html bootstrap-4

Html 我的图像不会显示在引导转盘上,html,bootstrap-4,Html,Bootstrap 4,我对编程相当陌生，遇到了一个问题，我的图像根本没有显示在我的引导转盘上。这就是我到目前为止所做的： <!DOCTYPE html> <html lang="en"> <head> <meta charset="=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="

我对编程相当陌生，遇到了一个问题，我的图像根本没有显示在我的引导转盘上。这就是我到目前为止所做的：

<!DOCTYPE html>
 <html lang="en">
  <head>
<meta charset="=utf-8">
<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.3.1/jquery.min.js"> 
</script>
 <script 
  src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> 
 </script>
 <title>Not An Ostrich</title>
<style type="text/css">
@import url("Style.css");
</style>    
</head>
<body>

<div class="container">

 <div id="myCarousel" class="carousel slide" data-ride="carousel">
   <!-- Indicators -->
<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>
</ol>
</div>    
<!--<div class="fixed-bottom">-->       
<div class="carousel-inner">
    <div class="item active">
        <img src="img/lauragilpin.jpg" alt="" width="200px">
    </div>

    <div class="item">
        <img src="img/nao.png" alt="">
    </div>      
</div>  

<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
 </a>
</div>

<div>
<div class="noapic">
        <img src="img/NaO_logo_blk.gif" alt="NAO" width="150px">
</div>

<!--</div>-->
<div class="asplogo">
<img src="img/ASP_RGB_BlackType_2LineHoriz.png" alt="asplogo" width="260px;">
</div>

</div>


</body>
</html>

有人能解释一下我怎样才能把它们展示出来吗？另外，原始文件是.tif文件，我想这就是为什么我保存在计算机上的其他图像显示得很好

谢谢

您没有将div附在正确的位置，即ol。请遵循以下代码

<div id="myCarousel" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
            <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>
            </ol>
        <!--<div class="fixed-bottom">-->
        <div class="carousel-inner">
            <div class="item active">
                <img src="https://dummyimage.com/1920x400/000/fff">
            </div>

            <div class="item">
                <img src="https://dummyimage.com/1920x400/000/fff">
            </div>
            <div class="item">
                <img src="https://dummyimage.com/1920x400/000/fff">
            </div>
        </div>

        <!-- Left and right controls -->
         <a class="left carousel-control" href="#myCarousel" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">Previous</span>
         </a>
         <a class="right carousel-control" href="#myCarousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">Next</span>
         </a>
    </div>

你可以创建一个工作副本吗？你可以仔细检查你的图像路径。使用绝对路径，以/作为项目的根目录。@Jtbs奇怪的是，对同一个img文件夹中的其他照片使用相同的路径img/123.jpg似乎是可行的。在这种情况下，您可能需要检查对不起作用的文件的文件权限。@karthik我认为我已经正确添加了这个部分。你能再解释一下吗？是因为它都在容器分区内吗？我想显示的照片可能太大了吗？它们都大约有90MB或稍大一点。每一张都能正常工作的照片大概有20kbs，就是这样。图像太大了！谢谢你的帮助！