CSS偽類可以為網頁添加一些特殊的外觀和交互效果。其中之一是遮眼罩，可以通過:hover偽類實現。下面是一些示例代碼：

/* 基本樣式 */
.mask {
position: relative;
display: inline-block;
}
.mask .content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
transition: all 0.3s ease-out;
}
/* 鼠標懸停時的樣式 */
.mask:hover .content {
opacity: 1;
}

在這個代碼示例中，首先要創建一個含有內容的容器，以及一個用來覆蓋容器的遮眼罩。當鼠標懸停在容器上時，遮眼罩會顯示，從而遮擋住容器中的內容。

此外，也可以使用:before或:after偽元素來創建遮眼罩，如下所示：

/* 使用:before偽元素來創建遮眼罩 */
.mask {
position: relative;
display: inline-block;
}
.mask:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.5);
z-index: 1;
opacity: 0;
transition: all 0.3s ease-out;
}
.mask:hover:before {
opacity: 1;
}
/* 使用:after偽元素來創建遮眼罩 */
.mask {
position: relative;
display: inline-block;
}
.mask:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url("mask.png") center center no-repeat;
background-size: contain;
z-index: 1;
opacity: 0;
transition: all 0.3s ease-out;
}
.mask:hover:after {
opacity: 1;
}

以上是使用:before和:after偽元素創建遮眼罩的代碼示例。通過修改background屬性，在:before中使用rgba顏色，或在:after中使用圖片來創建遮眼罩。