關于我們和聯系我們是我的兩個部分。聯系我們部分的背景屬性運行良好。但是，我現在想為兩個 div 的父包裝器添加背景圖片。因此，可以在兩個 div 上方看到背景影像。我無法確定阻止我顯示背景影像的問題。
索引.html：
<div class="aboutus-contact-us-wrapper" >
<div class="about-us-section">
// content here
</div>
<div class="contact-us">
// content here
</div>
</div>
樣式.css：
.aboutus-contact-us-wrapper {
width: 100%;
position: relative;
background-image: url('./images/ourboardvector.png');
background-size: 100%;
background-position: right;
background-size: contain;
}
.contact-us {
width: 100%;
height: 100vh;
background-color: #181f2b;
position: relative;
border-bottom: 20px;
color: #ffffff;
position: relative;
}
.about-us-section {
position: relative;
width: 100%;
height: 100vh;
background-color: #F1F1F1;
font-family: 'Lato' !important;
}
uj5u.com熱心網友回復：
將z-index兩個子 div 設定為-1.
Z Index (
z-index) 是一個 CSS 屬性，用于定義重疊 HTML 元素的順序。具有較高索引的元素將被放置在具有較低索引的元素之上。注意：Z 索引僅適用于定位元素（position:absolute、position:relative或position:fixed）
.aboutus-contact-us-wrapper {
width: 100%;
position: relative;
background-image: url('./images/ourboardvector.png');
background-size: 100%;
background-position: right;
background-size: contain;
}
.contact-us {
width: 100%;
height: 100vh;
background-color: #181f2b;
position: relative;
border-bottom: 20px;
color: #ffffff;
position: relative;
z-index: -1;
}
.about-us-section {
position: relative;
width: 100%;
height: 100vh;
background-color: #F1F1F1;
font-family: 'Lato' !important;
z-index: -1;
}<div class="aboutus-contact-us-wrapper">
<div class="about-us-section">
// content here
</div>
<div class="contact-us">
// content here
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/530752.html