时间戳

首页 > 解决方案 > Github 页面未显示我的 CSS 的图标和图像

html - Github 页面未显示我的 CSS 的图标和图像

问题描述

我在这里读过一些帖子，其中图像未显示在 Github 页面上的主要问题是因为它区分大小写。我一直在处理相同的图像不显示问题，但在这种情况下，我没有看到错误。

.header--button span{
display: inline-block;
width: 13px;
height: 8px;
margin-left: 10px;
background-image: url('/assets/icons/down-arrow.svg');

这是我放置大部分图像的方式，但我仍然可以找到我错在哪里？

这是我的仓库的链接 https://github.com/AlejandroCaputo/Batatabit_CryptoProject

这是我的 github 页面的链接 https://alejandrocaputo.github.io/Batatabit_CryptoProject/index.html

我错过了什么？

标签： htmlcssgithub-pages

解决方案

图标图像未显示问题的原因是由于图像的“参考路径”。

例如，名为“ down-arrow.svg”的图像是

实际上位于

/Batatabit_CryptoProject/assets/icons/down-arrow.svg,

但被称为：

 /assets/icons/down-arrow.svg

该问题可以通过两种方式解决：

  1. 使用 /Batatabit_CryptoProject/assets/icons/down-arrow.svg 参考图像及其实际完整路径 IE

  2. 使用相对路径引用图像，IE 通过从图像引用中删除前导 /。

推荐阅读