在Intranet中实现这样的方法非常多，有的采用捕获Mouse方法，有的采用多图片方法等等。在此，笔者则采用动态Css方法来实现，这样不仅简单，而且非常容易编写程序。

　　我们首先定义一组能产生Up,Dwon和正常效果的样式，如下：（以下的效果是在背景色为d0d0c8上产生的，若您的背景色不是，请修改rgb值即可)

<style>
.Up
{border-left: 1Px solid rgb(233,244,249);
border-right: 1px solid rgb(12,12,12);
border-bottom: 1px solid rgb(12,12,12);
border-top: 1px solid rgb(233,244,249);
cursor:hand;
}
.Down
{border-right: 1Px solid rgb(233,244,249);
border-left: 1px solid rgb(12,12,12);
border-top: 1px solid rgb(12,12,12);
border-bottom: 1px solid rgb(233,244,249);
cursor:hand;
}
.None
{border-top: 1Px solid rgb(208,208,200);
border-left: 1px solid rgb(208,208,200);
border-bottom: 1px solid rgb(208,208,200);
border-right: 1px solid rgb(208,208,200);
cursor:hand;}
</style>

　　再编写一个小函数，如下：（t表示某个td对象，n表示显示的效果，1=Up ,2=Down;其它表示正常)

function Check(t,n)
{
if(n==1) t.className ="Up"
else if(n==2) t.className ="Down" else t.className ="None"
}

　　那么在HTML中加入如下代码：<td class=None onmousedown=Check(this,2) onmouseover="Check(this,1)" onmouseout="Check(this,0)" onmouseup="Check(this,1)"></td>　即可大功告成。