用html和css创建一个网站，显示我的背景照片有麻烦

Question

我在创建的HTML网站上显示我的照片时遇到了麻烦。我试图创建一个视差背景，照片不会出现。如果有人能解释一下我做错了什么

下面是我的HTML代码:

<div class="wrapper_outer">
<div class="wrapper">
<div class="parallax_section">
<div class="parallax_bg" style="backgound-image: url(content/Family.jpg);"></div>
<h2>Welcome</h2>
</div>
</div>
</div>

下面是我的css代码:

.wrapper_outer{}
.wrapper{}
.parallax_section{
min-height: 100vh;
padding: 50px;
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
position: relative;
}
.parallax_bg{
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-size: cover;
background-position: center;
z-index: -1;
min-height: 100%;
}
.parallax_section h2{}

Answer 1

您写的是backgound-image而不是background-image，更改应该可以解决您的问题。

<div class="wrapper_outer">
<div class="wrapper">
<div class="parallax_section">
<div class="parallax_bg" style="background-image: url(content/Family.jpg);"></div>
<h2>Welcome</h2>
</div>
</div>
</div>