遮罩層是利用CSS設置，覆蓋在網頁或圖片上的一層透明或半透明色塊，常見用途包括彈窗、提示框等等。本文主要介紹利用CSS實現遮罩層漸變效果。

.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.8));
}

上述代碼創建了一個類名為“mask”的元素，通過設置絕對定位和寬高為100%實現覆蓋整個網頁的效果，背景使用了CSS linear-gradient線性漸變進行渲染，從頂部到底部變化，漸變色從半透明黑色到更加透明黑色。可以根據需求自行調整透明度和渲染方向。

除了線性漸變，CSS還支持其他的漸變方式，比如徑向漸變，具體示例如下：

.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(circle, rgba(0,0,0,0.5), rgba(0,0,0,0.8));
}

上述代碼使用了CSS radial-gradient徑向漸變，從圓心向周圍的方向進行渲染。同樣可以根據需求進行調整，比如將大小、形狀等等。需要注意的是，部分老版本的瀏覽器可能不支持CSS漸變，需要進行兼容性處理。