Question

我的网站上有一个导航栏，正在通过移动设备进行测试。由于某些原因，我作为导航菜单一部分的图像无法在Android版Chrome上显示。当我使用其他浏览器或在笔记本电脑上查看网站时，我没有任何问题。不幸的是，我没有iPhone可以测试。

该站点使用materialize.css。

以下是未显示的导航菜单图像的示例：

<div class="menu-container menu-column">
    <div class="menu-container menu-row">
        <div class="menu-container menu-item">
            <a href="/" class="waves-effect"> 
                <img id="id-home" class="image menu-1" src='/path/to/png/file.png'>
            </a>Home
         </div>
      </div>
</div>

我尝试使用devtools远程设备调试器查看控制台中的内容，没有错误消息或404或其他内容。我不知道该怎么办！

感谢您的帮助。如果需要，我可以提供更多信息。谢谢！

编辑：我添加了一个代码段。不幸的是，我不确定如何将图像加载到jsfiddle中，因此不可能完全再现该错误。同样，它在我的浏览器和响应模式下看起来不错。在Android版Chrome浏览器中，<img>消失了。

提琴：https://jsfiddle.net/hermana/z2b9L1nv/26/

Answer 1

您的文件没有.jpg或png之类的扩展名，并且图像中的类属性值也需要用双引号引起来，以便src属性与类值分开

<img>不会在Android版Chrome上显示

1 个答案: