请问如何实现ie工具条上鼠标移上去是突出的效果

<html>
<head>
<title>Untitled Document</title>
<style type="text/css">
.coolButton {border: 1px solid buttonface; padding: 1px; text-align: center; cursor: default;font: menu;}
.coolBar {background: buttonface;border-top: 1px solid buttonhighlight; border-left: 1px solid buttonhighlight; border-bottom: 1px solid buttonshadow; border-right: 1px solid buttonshadow; padding: 2px; font: menu;}
</style>
<script language="javascript">
function showButton(){}
function hideButton(){}

</script>
</head><body>
 <table border="0" height="20" cellpadding="0" cellspacing="0" bgcolor="#E4E4E4">
  <tr>
   <td valign="bottom" class=coolButton onmouseover='this.className="coolBar"' onmouseout='this.className="coolButton"'>刷新</td>
  </tr>
 </table>
</button>
</body>
</html>

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    <style>
    body 
    {
    font: 9pt 宋体; margin-left: 0; margin-top:0; margin-right:0; margin-bottom:0
    }
    td
    {
    font: 9pt 宋体;
    }
    </style>
    </HEAD><script>
    function ToOutset(obj)
    {
    obj.style.borderLeft = "1px solid #FFFFFF";
    obj.style.borderTop = "1px solid #FFFFFF";
    obj.style.borderRight = "1px solid #808080";
    obj.style.borderBottom = "1px solid #808080";
    }function ToInset(obj)
    {
    obj.style.borderLeft = "1px solid #808080";
    obj.style.borderTop = "1px solid #808080";
    obj.style.borderRight = "1px solid #FFFFFF";
    obj.style.borderBottom = "1px solid #FFFFFF";
    }function ToFlat(obj)
    {
      var border = obj.style.backgroundColor;
    if (border=="transparent")
    border="#C0C0C0"; obj.style.borderLeft = "1px solid " + border;
    obj.style.borderTop = "1px solid " + border;
    obj.style.borderRight = "1px solid " + border;
    obj.style.borderBottom = "1px solid " + border;
    }function __btnOnMouseOver(obj)
    {
      ToOutset(obj);
    }function __btnOnMouseOut(obj)
    {
    ToFlat(obj);
    }function __btnOnMouseDown(obj)
    {
    ToInset(obj);
    }function __btnOnMouseUp(obj)
    {
    ToOutset(obj);
    }</script><BODY>
    <TABLE bgColor=#dddddd cellPadding=0 cellSpacing=0 
      style="BACKGROUND-COLOR: #dddddd; BORDER-BOTTOM: #dddddd 1px solid; BORDER-LEFT: #dddddd 1px solid; BORDER-RIGHT: #dddddd 1px solid; BORDER-TOP: #dddddd 1px solid; CURSOR: hand; DISPLAY: block; HEIGHT: 20px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px; WIDTH: auto" title="测试" 
      onmouseover="__btnOnMouseOver(this)" onmouseout="__btnOnMouseOut(this)" onmousedown="__btnOnMouseDown(this)" onmouseup="__btnOnMouseUp(this)">
    <TBODY>
      <TR>
        <TD align=middle style="PADDING-BOTTOM: 1px; PADDING-LEFT: 3px; PADDING-RIGHT: 3px; PADDING-TOP: 1px" vAlign=center>
           <IMG align=absMiddle height=16 src="Add.gif" width=16>
        </TD>
        <TD align=middle noWrap style="PADDING-BOTTOM: 1px; PADDING-LEFT: 3px; PADDING-RIGHT: 3px; PADDING-TOP: 1px" vAlign=center>
          测试
        </TD>
      </TR>
    </TBODY>
    </TABLE>
    </BODY>
    </HTML>