CSS 图像未显示在页面上

Question

我的路径可能不正确，但我将图像从其文件夹拖放到 css 背景属性中，所以它应该是正确的。看起来不错，但不确定。如果我从注释掉的代码中看到的 https url 加载另一个图像，它工作正常!

如果我有正确的路径，是否与图像安全或权限有关？我将图像从另一个文件夹复制到 App_Data/Images/。 我没有收到任何 javascript 控制台错误或控制台中的任何内容，提示找不到图像。

.centerMarker {
  position: absolute;
  /*url of the marker*/
  background: url('../App_Data/Images/meetups.png') no-repeat;
  /*this does not work*/
  /*background: url(https://maps.gstatic.com/mapfiles/markers2/marker.png) no-repeat;*/
  /*this works*/
  /*center the marker*/
  top: 50%;
  left: 50%;
  z-index: 1;
  /*fix offset when needed*/
  margin-left: -10px;
  margin-top: -34px;
  /*size of the image*/
  height: 34px;
  width: 20px;
  cursor: pointer;
}

site.css是css所在的地方，从这张图可以看出图片在App_Data中的Images中。

这是我在 IE 的开发工具中的 DOM 资源管理器中看到的。 这是正确的吗？

Answer 1

尝试使用根相对 URL 而不是绝对路径。因此，它不是从当前文件开始，爬上树，然后返回，而是从顶部开始，然后向下工作。

background: url('/App_Data/Images/meetups.png') no-repeat;

或

background: url('~/App_Data/Images/meetups.png') no-repeat;

对于您的文件结构，您的路径看起来确实是正确的，但是一旦站点在服务器上呈现，您的结构可能会有点不同(例如，Content 文件夹可能只是存储所有 View 的地方，但被省略了来自实际路径)。