在CSS中,我們可以使用:hover偽類(lèi)來(lái)控制鼠標(biāo)懸停在元素上時(shí)的樣式。接下來(lái)我們來(lái)學(xué)習(xí)如何讓邊框在鼠標(biāo)懸停時(shí)改變樣式。
首先,我們需要給元素添加邊框樣式:
.box { border: 1px solid black; }
然后,我們可以使用:hover偽類(lèi)來(lái)控制懸停時(shí)的邊框樣式。例如,當(dāng)鼠標(biāo)懸停在.box元素上時(shí),我們想要邊框變成紅色:
.box:hover { border-color: red; }
如果我們不僅想改變邊框顏色,還想改變邊框的寬度,可以這樣做:
.box:hover { border-width: 3px; border-color: red; }
這樣在鼠標(biāo)懸停時(shí),邊框?qū)⒆兂?像素寬的紅色邊框。