html - 图片没有加载到 Chrome 上的代码笔上？

Question

当我为图像使用本地存储时，图像在 Firefox 和 chrome 上工作，但是当我将图像上传到 imgur 并将它们加载到 codepen 时——它只在 Firefox 上工作，图像根本不加载chrome，为什么会这样？

<img src="https://i.imgur.com/OBiyZL0.jpg" alt="Blog Thumbnail">
background: url('https://i.imgur.com/6RELfrW.jpg') no-repeat;

这就是我的做法，CSS 适用于与显示的 html 不同的元素，但都不适用于 codepen/chrome。

此外，chrome 上的导航栏无法正常工作，为什么 justify-content: right;不行？

有问题的codepen:https://codepen.io/anon/pen/RBRJEN

Answer 1

Imgur 图片出现 403 错误。而不是 imgur 尝试使用一些在线图像服务，例如 https://imgbb.com/ .它会起作用。

我使用的图片链接是https://ibb.co/cDR14J

.splashCover {
  margin-top: 0;
  height: 200px;
  background: url('https://ibb.co/cDR14J') no-repeat;
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: top;
  filter: opacity(.6);
}

下面是工作码笔:

https://codepen.io/anon/pen/EpyRMO