CSS的mask（蒙版）屬性可以幫助用戶對元素進行圖像遮罩的操作，其中旋轉就是一種非常實用的遮罩效果。本文將介紹如何使用CSS mask屬性進行旋轉操作。

代碼：
div {
background-image: url("example.jpg");
-webkit-mask-image: -webkit-linear-gradient(top, black 50%, transparent 100%);
mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
transition: -webkit-transform 1s ease-in-out;
transition: transform 1s ease-in-out;
}
div:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}

上面的代碼中，我們創建了一個div元素，然后通過CSS的background-image屬性設置了其背景圖像。接著，我們使用-webkit-mask-image屬性和mask-image屬性定義了一個線性漸變，遮罩了50%的div區域。

在鼠標懸停時，我們使用CSS的:hover偽類將元素進行旋轉。注意，我們使用了-webkit-transform和transform兩個屬性，在不同的瀏覽器中都能夠實現兼容性，同時使用了transition屬性讓平滑過渡。

CSS的mask屬性不僅可以實現旋轉，還可以用于裁剪、模糊等圖像處理，具有十分豐富的應用場景。通過靈活使用mask屬性，我們可以為頁面設計出更加獨特的效果，提供更加有趣的用戶體驗。