javascript - png 在 Firefox/IE 中显示，但在 chrome 中不显示

Question

我正在制作我的第一个网站，终于托管了所有内容，但图像未在 google chrome 中显示。当它在 IE 中运行时，我感到很惊讶，因为我认为它们通常会带来最多的麻烦。

这是我输入图像的 html:

<th class="red-header"><p>Strength</p>
    <img src="./pictures/strength.png" alt="str" class="str">
</th>
<th class="blue-header"><p>Intelligence</p>
    <img src="./pictures/intelligence.png" alt="int" class="int">
</th>
<th class="green-header"><p>Dexterity</p>
    <img src="./pictures/dexterity.png" alt="dex" class="dex">
</th>

和

<th class="red-header"><p>Fire</p>
    <img src="./pictures/fire.png" alt="fire" class="fire">
</th>
<th class="blue-header"><p>Cold</p>
    <img src="./pictures/cold.png" alt="cold" class="cold">
</th>
<th class="yellow-header"><p>Lightning</p>
    <img src="./pictures/lightning.png" alt="lightning" class="lightning">
</th>

我在搜索中找不到任何有用的内容。请分享您的任何想法，或者让我知道我可以做些什么来帮助您回答。

Answer 1

为了加快网页浏览速度，浏览器设计用于下载网页及其内容(例如图像)，并将它们本地存储在计算机硬盘驱动器上称为“缓存”的区域中。

浏览器缓存包含您在访问网站时查看或下载的每个项目的记录，因此当您第二次访问同一页面时，浏览器会通过从缓存本地加载页面而不是再次下载所有内容来加快显示时间.

在测试更改和新图像等时，您有时希望再次从源获取数据，并更新缓存。

点击F5大多数时候都会给你相同的页面，即使内容发生了变化(取决于标题等)，因为它可能会从缓存加载页面，而 CTRL-F5 会强制刷新缓存，并保证如果内容发生更改，您将获得新内容。