移動端H5頁面遮罩層

1.建一個遮罩層div

<div id="cover"></div>

2.設置遮罩層樣式

#cover {
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.5);
    width: 100%; /*寬度設置為100%，這樣才能使隱藏背景層覆蓋原頁面*/
    height: 100%;
    filter: alpha(opacity=100); /*設置透明度為100%*/
    opacity: 1; /*非IE瀏覽器下設置透明度為100%*/
    display: block;
    z-Index: 999;
}

3.設置不遮罩部分的z-index

<div style="width: 85%;z-index:9999;height:85%;background-color: #f0f0f0">
</div>

4.效果圖

 

 

參考鏈接:https://www.cnblogs.com/wangshishuai/p/10097860.html