html - Mozilla Firefox 不从本地机器加载图像

标签 html css firefox mozilla

我正在尝试运行一个带有图像和 div 的简单 html 页面。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<style>
	* {
  box-sizing: border-box;
}
	.container {
       width: 240px;
       height: 280px;
       position: relative;
    }
	
	 .tag {
    position: absolute;
    left: 10%;
    bottom: 0px;
	height: 220px;
	width: 202px;
    background-color: #4a8ab0;
	border-radius: 6px;
    color: #FFFFFF;
    padding: 10px;
	opacity: 0.9;
    }
	
	.sideHeader {
		font-family: 'Quicksand', sans-serif;
		font-size: 18px;
	}
	
	p {
		font-family: 'Open Sans', sans-serif;
		font-size: 11.5px;
		letter-spacing: 0.01em;
	}
	
</style>
</head>
<body>
<!--​-->
<div class="container">
       <img src="D:/ata/images/cropped_box.jpg" style="height:210px;width:240px;">
	   <div class="tag"><div class="sideHeader"><b>Did you know</b></div>
		<p>
			With HTML you can create your own Website.This tutorial teaches you everything about HTML.HTML is easy to learn - You will enjoy it.
		</p>
		</div>
</div>
</body>
</html>

我可以在显示图像和 div 的谷歌浏览器和 Internet Explorer 中成功运行代码。在 mozilla firefox 中,图像不显示。它也没有显示错误。我尝试在互联网上使用图像。哪个显示正常。为什么 mozilla 的行为与本地数据不同?那是特定于浏览器的问题吗?我使用的是 66.0.2(64 位)版本的 firefox。我该如何解决?我尝试将反斜杠更改为正斜杠。但它不起作用。请帮忙。提前致谢。

最佳答案

嗯,解决方案非常简单。将图像标签重写为:

<img src="file://D:/ata/images/cropped_box.jpg" style="height:210px;width:240px;">

关于html - Mozilla Firefox 不从本地机器加载图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55412628/

相关文章:

javascript - 远程站点,本地文件重定向

css - 当在没有宽度的 float div 中 float 子项时,Chrome 和 Firefox 的渲染不同。

jQuery 图像预加载在 FireFox 中第一次不起作用

html - Twitter Bootstrap 3 的 IE8 问题

css - 通过 css 从多个输入隐藏最后 3 个输入类型文本

javascript - 在单独的页面上显示结果

javascript - CSS 转换未在所有浏览器中使用 jQuery 更新

javascript - 使用 Kendo 进行动态 HTML 元素绑定(bind)

css - 两列 div 布局,一列占其余部分

jquery - 计算具有相同 id JQUERY 的 div 元素