PNG图像不显示

我目前正在使用引导程序折叠导航来查看手机上的网站。我想从页面顶部隐藏自己的徽标，并使用我的切换按钮将其内联，以节省一些屏幕空间。当我尝试将我的图像放入导航栏中时，它似乎不显示，所有显示的都是我的ALT文本。这是我目前使用的代码。PNG图像不显示

<div class="row"> 
     <div class="col-md-12"> 
      <nav id="menu1" class="navbar navbar-default" role="navigation"> 
       <div class="navbar-header"> 
        <div id="logo" class="pull-left hidden-md hidden-lg"> 
          <div class="img-responsive logo-small"> 
           <img src="images/logo-xs.png" alt="small-logo"/> 
         </div> 
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
         <span class="sr-only">Toggle navigation</span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
       </div> 
       <?php wp_nav_menu(array('theme_location' => 'main-menu', 
             'depth' => 2, 
              'container_class' => 'collapse navbar-collapse', 
             'menu_class' => 'nav nav-pills nav-justified', 
             'walker' => new wp_bootstrap_navwalker())); ?> 

      </nav> 
     </div>

来源

2014-10-10 pocockn

当您的ALT标记显示，但图像不是，这可能意味着您的路径/图像名称是错误的。 – 2014-10-10 10:41:26

首先，你有没有指定正确的图像路径？你可以右键单击图像的位置并在浏览器调试器中查看它（检查chrome中的元素..），尝试在元素查看器中右键单击URL并选择“在新选项卡中打开”来打开图像，也可以使用资源查看器来查看图像是否已正确加载）（虽然这可能不是问题，但试用起来相当快） – Snellface 2014-10-10 10:41:45

我使用括号，当我将鼠标悬停在链接路径上时，它会显示图像我想显示，所以我很肯定图像路径是正确的，谢谢 – pocockn 2014-10-10 10:45:03

尝试使用Chrome开发工具找到图像的网络请求。

Chrome Dev Tools, network tab

来源

2014-10-10 10:52:18 Gustav

好像你缺少一个右</div>标签。我想它应该在<button>

来源

2014-10-10 10:43:18 Gustav

对不起，我只是没有把它放在它后面，我的最后一个div关闭行。谢谢 – pocockn 2014-10-10 10:49:58

你缺少一个右 “分区” 标签。因为在“nav”标签部分之间打开三个“div”但关闭两个“div”标签。

来源

2014-10-10 11:17:32 dharmveer

PNG图像不显示

回答

相关问题