半透明遮罩背景常用於彈窗的背景

如下所示：

程式碼如下所示：

.overlay {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 4000;
    position:fixed;
}

小結（非常重要）：首先是fixed固定定位相對於視窗定位，配合top,left,bottom,right為0可以充滿整個視窗背景，設定rgba透明背景色，為了在彈窗過程中背景上面沒有其他內容，所以需要把z-index設定的高一點，而彈窗內容比z-index高即可達到上圖效果

注意：上面的背景我們充滿了整個視窗，我們完全可以通過不同的定位實現不同區域的半透明遮罩背景

本部落格由博主原創，如需轉載需說明出處！謝謝支援！