背景图像未显示在 html 页面中

Question

我是 html 的初学者，我正在尝试使用图像作为我页面的完整背景。 我希望图像适合我的场景，这样我就不必向下滚动查看图像的 rest。 我已经尝试过了，但图像甚至没有加载开始。

 .html, .body{ margin:0; height:100%; } #map{ background: url("HTML_FILES/IMAGES/map.jpg"); height:100%; width:100%; background-position: center; background-repeat: no-repeat; background-size: cover; }

 <div id = "map"></div>

我的文件夹结构如下：

PROJECT 
  HTML_FILES
      mypage.html
      IMAGES 
          map.jpg

感谢您帮助指导我加载图像并正确调整它。 先感谢您。

Answer 1

 .html, .body{ margin:0; height:100%; } #map{ background-image: url(https://images.unsplash.com/photo-1495567720989-cebdbdd97913?ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=80); height:100%; width:100%; background-position: center; background-repeat: no-repeat; background-size: cover; position:absolute; top:0; bottom:0; }

 <div id = "map"></div>

Answer 2

使用下面的样式来完成它。

body {
    background: url(HTML_FILES/IMAGES/map.jpg);
    height: 100%;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}