鼠標(biāo)動作在CSS中是一個常見的交互效果,可以用來增加頁面的友好性和用戶體驗。
/* 鼠標(biāo)懸停效果 */ .element:hover { background-color: #ccc; } /* 點擊效果 */ .element:active { background-color: #aaa; } /* 鼠標(biāo)移開效果 */ .element:focus { outline: none; } /* 彈出菜單 */ .menu { display: none; } .element:hover .menu { display: block; }
上述代碼展示了一些常見的鼠標(biāo)動作效果。當(dāng)鼠標(biāo)懸停時,元素會變成灰色背景;當(dāng)被點擊時,元素會變成深灰色背景;當(dāng)鼠標(biāo)移開時,元素的焦點框會消失。
此外,還展示了一個彈出菜單效果,當(dāng)鼠標(biāo)懸停在指定元素上時,會顯示出該元素下的菜單。
鼠標(biāo)動作在CSS中很常見,也能用簡單的代碼實現(xiàn)出各種效果,提高了用戶對網(wǎng)頁的滿意度。