以前做遮罩層都是寫最小高度來占滿屏，但是總會出現問題，也沒改變，今天一個人在交流群上問這個時，看到一個回答解決了我這一個bug，學到了，現在記錄一下樣式。

<div class=’popContainer’></div>

div.popContainer{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.3);}

這樣遮罩層就會占滿屏了

補充知識：vue 鎖定蒙版 不讓里面頁面滑動

其實就是一句代碼，在你的蒙版里面添加一句@touchmove.prevent就好了，下面是例子

<!-- 陰影背景層 --> <div @touchmove.prevent : @click='closeAction'></div>

以上這篇vue 彈出遮罩層樣式實例就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持好吧啦網。