如何實現超鏈接類似按鈕陷下的效果?_Div+CSS教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!
超鏈接的hover狀態,通?梢愿淖冾伾,增加或去除下劃線等效果來提醒訪客。我們也看到過有一些文字鏈接,當鼠標移上去時(hover狀態)產生位移,類似于按鈕陷下的效果,這該如何實現呢?
圖片的按鈕陷下效果制作原理是一樣的。我們看下面的代碼:
示例代碼 [www.wf0088.com]
position: relative; top:1px; left:1px;
這段代碼的含義為,相對定位,距上部位移1象素,距左部位移1象素。我們可以將上面的代碼加入到超鏈接的hover狀態中,就實現了類似按鈕陷下的效果。
我們看下面的實例:
代碼調試框 [www.wf0088.com]
[ 可先修改部分代碼 再運行查看效果 ]
相關Div+CSS教程:
- 相關鏈接:
- 教程說明:
Div+CSS教程-如何實現超鏈接類似按鈕陷下的效果?。