在CSS中,我們可以使用偽類選擇器來捕獲獲得焦點的事件,我們可以使用input:focus
或textarea:focus
等偽類選擇器來選中當(dāng)前獲得焦點的元素,并應(yīng)用相應(yīng)的樣式。
如果我們想要讓獲得焦點的元素在背景色上有所變化,可以編寫如下CSS代碼:
input:focus, textarea:focus { background-color: #f0f0f0; }
這段代碼表示,當(dāng)input
或textarea
元素獲得焦點時,它們的背景色將變?yōu)榛疑?/p>
除了背景色,我們還可以改變獲得焦點元素的邊框顏色、字體顏色等,以吸引用戶的注意力。
input:focus, textarea:focus { border-color: #008000; color: #000; }
這段代碼表示,當(dāng)input
或textarea
元素獲得焦點時,它們的邊框顏色將變?yōu)榫G色,字體顏色將變?yōu)楹谏?/p>
需要注意的是,雖然使用偽類選擇器可以捕獲獲得焦點的事件,但并不能直接處理事件,如果我們需要在JavaScript中處理獲得焦點的事件,還需要結(jié)合JavaScript代碼來實現(xiàn)。