CSS 中有一種非常實用的技巧，可以讓鼠標(biāo)滑動到元素上時，自動隱藏它。這對于創(chuàng)建交互式的用戶界面非常有用，可以提高用戶體驗。下面我們來介紹如何實現(xiàn)這種鼠標(biāo)滑動自動隱藏的效果。

code {
opacity: 0;
transition: opacity .3s ease-in-out;
}
code:hover {
opacity: 1;
}

以上代碼中，我們創(chuàng)建了一個 CSS 規(guī)則，將代碼塊的 opacity 屬性設(shè)置為 0，使其完全不可見。然后，我們使用 CSS 過渡（transition）屬性，為其添加了一個 0.3 秒的淡入淡出效果。當(dāng)鼠標(biāo)滑動到

code

元素上時，我們將其 opacity 屬性設(shè)置為 1，使其變成可見。

如果你想讓文本塊、圖片、按鈕等元素具有相同的效果，只需將代碼中的

code

替換為其他的選擇器即可。另外，如果你想改變淡入淡出效果的時長和類型，可以通過調(diào)整 transition 屬性來實現(xiàn)。

總體來說，鼠標(biāo)滑動自動隱藏的效果是一種簡單而有效的 UI 設(shè)計技巧，可用于提高用戶體驗。嘗試使用上述代碼來創(chuàng)建自己的交互式設(shè)計，體驗其中的魅力吧。