我是一个新的编码，我正在尝试设置一个图像作为我的CSS页面的背景。我可以让背景改变颜色，但当我尝试使用一个实际的图像，什么都不加载。
以下是我的HTML：
<!DOCTYPE HTML>
<head>
<title>Beckett Wedding</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous">
<link rel="icon" type="image/x-icon" href="./assets/favicon.ico" />
<link rel="stylesheet" href="styles.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Infant:wght@300&display=swap"
rel="stylesheet">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<div class = "container-fluid" id = "background-first-page">
<h1>Beckett Wedding</h1>
<div class = "container-fluid">
<div class = "row">
<div class = "col-2"> <a href = "thebrides.html"> The Brides </a> </div>
<div class = "col-2"> <a href = "thebridalparty.html"> The Bridal Party </a> </div>
<div class = "col-2"> <a href = "RSVP.html"> RSVP </a> </div>
<div class = "col-2"> <a href = "Directions.html" > Directions </a> </div>
<div class = "col-2"> <a href = "Details.html"> Details </a> </div>
<div class = "col-2"> <a href = "Gifts.html"> Gifts </a> </div>
</div>
</div>
</div>
</body>
</html>
以下是我的CSS：
#background-first-page {
background-image: url ("https://images.unsplash.com/photo-1589401774008-64bcae0af959?
ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mjc3fHxzcHJpbmclMjBmbG93ZXJzfGVufDB8fDB8&ixlib=rb-
1.2.1&auto=format&fit=crop&w=500&q=60");
height: 100vh;
}
body {
color: blue;
font-family: 'Cormorant Infant', serif;
}
我做错了什么？
删除url和（“image-url”）；之间的空格。
