图像未出现在本地主机上

Question

图像没有出现在我的本地主机上。这是HTML代码。我尝试了几种变体来显示图像。使用 Twitter 引导程序。任何帮助将不胜感激。

  <div class="media">
  <a class="pull-left" href="">
  <img class="media-object" src="/img/grads.jpg/64x64">
  </a>
  <div class="media-body">
  <h4 class="media-heading">Collaborate with students at other Universities</h4>
  <p>Join your classes and work with other students on studying without having to meet up.</p>
  </div>
  </div>

  <div class="media">
  <a class="pull-left" href="">
  <img class="media-object" src="grads.jpeg/64x64">
  </a>
  <div class="media-body">
  <h4 class="media-heading">Meet new friends you're in class with</h4>
  <p>Pick who you want to be a stranger in your own classes. School is social and so is moreo. : )</p>
  </div>
  </div>

这是 CSS 代码。不知道我做错了什么。

<link href="../assets/css/bootstrap.css" rel="stylesheet">
<style type="text/css">
  body {
    padding-top: 10px;
    padding-bottom: 20px;
  }

  /* Custom container */
  .container-narrow {
    margin: 0 auto;
    max-width: 700px;
  }
  .container-narrow > hr {
    margin: 30px 0;
  }

  /* Main marketing message and sign up button */
  .jumbotron {
    margin: 30px 0;
    text-align: center;
  }
  .jumbotron h1 {
    font-size: 72px;
    line-height: 1;
  }
  .jumbotron .btn {
    font-size: 15px;
    padding: 10px 20px;
  }

  /* Supporting marketing content */
  .marketing {
    margin: 5px 0;
  }
  .marketing p + h4 {
    margin-top: 14px;
  }
</style>
<link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">

Answer 1

尝试查看源代码并检查图像的路径。由于您使用了相对路径，请检查是否在本地获取了正确的图像路径

Answer 2

验证您的图片路径。它应该以文件名及其正确的扩展名结尾。

看你有，

<img class="media-object" src="grads.jpeg/64x64">

我认为可能是这样的；

<img class="media-object" src="/64x64/grads.jpeg">

现在，如果图像 (grads.jpeg) 在 root 的 64x64 文件夹中可用，那肯定会渲染。

Answer 3

使用Bootstrap image 进行图像加载和媒体对象使用data-src 属性而不是src 但我没有看到任何使用直接图像URL Bootstrap Media object 加载图像的示例

编辑

我认为这个标签是指在线网址，我不确定。看看这个placehold 这个 URL 是一个实用程序站点，它像引导示例一样重新调整托管图像的大小