背景圖像 (CSS) 不會出現在網站上

Question

我已經嘗試了一切，但我的背景圖片不會顯示

圖像在圖像文件夾中

我的文件鏈接到 CSS

<link rel="stylesheet" href="css/style.css">

html 上也有以下幾行

<div id="bgImage" class="bgImageClass">
    
    </div>

同時在style.css

.bgImageClass {

 background-image: url('../images/background.jpg');

}
#bgImage { 
    position:absolute; width:300px; height:250px;
transition: opacity 0.5s;
}

我希望有人能幫幫忙

先感謝您

Answer 1

試試這些 CSS styles 來顯示背景圖像。

 .bgImageClass { background-image: url('https://dummyimage.com/16:9x1080'); background-size: cover; background-repeat: no-repeat; background-position: center; position:absolute; width:300px; height:250px; transition: opacity 0.5s; }

 <div id="bgImage" class="bgImageClass"></div>

Answer 2

在class 選擇器或 id 選擇器中混合所有這些屬性，如下所示：

.bgImageClass { 
         background-image: url('../../image/background.jpg'); 
background-size: cover;
background-repeat: no-repeat;
background-position: center;
position:absolute; 
width:300px; 
height:250px; 
transition: opacity 0.5s; 
   }