CSS实现的鼠标经过按钮的效果

来源：互联网发布：php项目部署到服务器编辑：程序博客网时间：2024/05/14 18:04

点击这里使用E-mail订阅本Blog：

鼠标经过的效果

在一网页看到一效果，就是鼠标移上按钮时，按钮是突起的，鼠标移走后，就又恢复为平的了，我本以为是翻转图片，后下载下来看，它是一个小表格，在上面用了样式。
代码如下：

<style>

.style1 {background-color:#CCCCCC;border-left:1px solid #F5F5F5;border-top:1px solid #F5F5F5;border-right:1px solid #333333;border-bottom:1px solid #333333;width:80px;height:20px;}

.style2 {background-color:#CCCCCC;border-left:1px solid #000000;border-top:1px solid #000000;border-right:1px solid #F5F5F5;border-bottom:1px solid #F5F5F5;width:80px;height:20px;}

</style>

<table id=myButton><tr><td align=center onMouseover=this.className='style1' class=style2 onMouseout=this.className='style2' >Button</td></tr></table>

【转自：http://bbs.blueidea.com/thread-1421781-1-1.html】点击这里使用RSS订阅本Blog：