CSS 實(shí)現(xiàn)鼠標(biāo)移入顯示就是指當(dāng)鼠標(biāo)移入某一個(gè)元素時(shí),該元素的某些屬性會(huì)發(fā)生改變從而顯示出更多的內(nèi)容。
/* 首先需要設(shè)置元素的初始屬性 */ .element{ width: 200px; height: 200px; background-color: white; color: black; border: 1px solid black; opacity: 0.5; } /* 當(dāng)鼠標(biāo)移入該元素時(shí),其屬性會(huì)改變 */ .element:hover{ opacity: 1; height: 400px; background-color: lightblue; color: white; border: 2px solid lightblue; }
在上述代碼中,我們?cè)O(shè)置了一個(gè)元素的初始屬性(寬度、高度、背景顏色、邊框顏色等),然后使用:hover偽類(lèi)選擇器,當(dāng)鼠標(biāo)移入該元素時(shí),該元素的屬性發(fā)生改變(高度增加、背景顏色改變、邊框變粗等)。這樣就能實(shí)現(xiàn)鼠標(biāo)移入時(shí)顯示更多的內(nèi)容的效果。