CSS3是前端開發(fā)中一種非常重要的技術,它可以讓網(wǎng)頁的顯示效果更加豐富多彩,其中一種常用的技術就是發(fā)光過渡。
.box { background-color: #fff; border: 1px solid #ccc; padding: 20px; box-shadow: inset 0 0 3px #ccc; transition: box-shadow .3s ease-in-out; } .box:hover { box-shadow: inset 0 0 5px #00BCD4, 0 0 10px #ccc; }
上述代碼中,我們?yōu)橐粋€名為.box的盒子元素添加了一個基礎樣式,其中包含了背景顏色、邊框、內(nèi)邊距和內(nèi)陰影等。接著,在.box:hover偽類下設置了一個過渡效果,即當鼠標懸停在這個盒子上時,它的陰影效果將發(fā)生變化,從而實現(xiàn)了一個簡單的發(fā)光過渡效果。
通過這種方式,我們可以為任何元素添加發(fā)光過渡效果,讓它們在交互時更加生動有趣,提高用戶的使用體驗。