CSS3中的懸浮移出效果是非常常見的一個特性,它可以使鼠標懸停在某個元素上時,改變該元素的狀態,比如改變其背景顏色、改變其形狀等等,從而為用戶帶來更好的交互體驗。通常這個效果使用:hover偽類來實現,下面我們來看一些例子:
button:hover { background-color: #f00; }
這個例子是當鼠標懸停在button元素上時,該元素的背景顏色將變成紅色。
a:hover { text-decoration: underline; }
這個例子是當鼠標懸停在a元素上時,該元素的下劃線將出現。
.box:hover { transform: scale(1.2); }
這個例子是當鼠標懸停在.box元素上時,該元素將放大1.2倍。
需要注意的是,某些瀏覽器可能并不支持所有CSS3的移出效果,建議在使用時進行兼容性測試。