背景图像不工作

Question

HTML

<div id="home"></div> 

CSS

#home{background-image:url("img/me.jpg");} 

如上我的代码不工作。我检查了文件夹“img”与我的index.html具有相同的位置。

Answer 1

您的<div>没有内容，也没有尺寸（宽/高）。

另外，检查路径。我会从根开始并从那里建立它。即/img/me.jpg。

Answer 2

你需要给元素一个宽度和高度。另外，您的源路径可能关闭。您还应该添加以下内容来控制背景图像的显示方式。下面将显示100％视口高度和100％宽度的图像。基本上，全屏。

HTML

<div id="home"></div> 

CSS

#home { 
    height: 100vh; 
    width: 100%; 
    background:url('../img/me.jpg') no-repeat; 
    background-position: center; 
    background-size: cover; 
}