Css 圖片黑色遮罩是一種美化圖片或增加圖片透明度的方法。通過給圖片添加一個黑色半透明覆蓋層，可以讓圖片更加深邃和神秘。

/*首先定義一個樣式類*/
.mask {
position: relative;
display: inline-block; /*或block*/
}
/*定義半透明覆蓋層*/
.mask::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0,0,0,0.5); /*半透明黑色*/
opacity: 0;
transition: opacity 0.3s ease-in-out;
}
/*鼠標懸浮時，覆蓋層變為不透明*/
.mask:hover::before {
opacity: 1;
}

上述代碼中，通過定義一個樣式類 "mask" ，并在 "mask" 下增加一個偽元素 "::before" ，來實現圖片的黑色遮罩。使用絕對定位將半透明黑色覆蓋層定位到圖片上，并設置覆蓋層的透明度為0，鼠標懸浮時將透明度更改為1，從而實現圖片遮罩的效果。

最后，將要添加遮罩的圖片的 "class" 值設置為 "mask" 即可。