• 注册
  • 关于作者
    企业认证:趣记站长
    关注 6 粉丝 4 喜欢 9 内容 992
    江西省·南昌市
    聊天 送礼
    • 查看作者
    • 如何在CSS样式中利用expression实现JavaScript中的onmouseover/onm

      如何在CSS样式中利用expression实现javascript中的onmouseover/onmouseout事件

      /*当鼠标移动到这里(比如表格里的一行)的时候背景色变化为黄色*/
      onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});

      /*当鼠标移动到这里的时候背景色还原为原来的颜色*/
      onmouseout: expression(onmouseout=function (){this.style.backgroundColor =''});

      下面的实例在CSS样式表里使用onmouseover/onmouseout事件;当移动到单元格的时候该单元格的背景色/边框/文字颜色将改变。根据需要可以加入其它的属性,实现一些简单的网页特效。

       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
      <HTML>
      <HEAD>
      <TITLE> CSS样式里使用javascript(onmouseover/onmouseout)2</TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">

      <style type="text/css">
      table
      {

      expression的应用之 -- 用CSS做出双色相间表格

      HTML&CSS

       background-color:#000000;
       cursor:hand;
      }

      td
      {
        /*设置onmouseover事件*/
        onmouseover: expression(onmouseover=function (){this.style.borderColor ='blue';this.style.color='red';this.style.backgroundColor ='yellow'});

        /*设置onmouseout事件*/
        onmouseout: expression(onmouseout=function (){this.style.borderColor='';this.style.color='';this.style.backgroundColor =''});
        background-color:#ffffff;
      }
      </style>
      </HEAD>

      <BODY>
      <TABLE cellspacing='1px' border='1'>
      <TR>
       <TD>风儿吹散了蒲公英......    </TD>
       <TD>风儿吹散了蒲公英......   </TD>
       <TD>风儿吹散了蒲公英......   </TD>
      </TR>
      <TR>
       <TD>风儿吹散了蒲公英......    </TD>
       <TD>风儿吹散了蒲公英......   </TD>
       <TD>风儿吹散了蒲公英......   </TD>
      </TR>
      </TABLE>
      </BODY>
      </HTML>

      相关连接:
      1.CSS中expression使用简介

      2.expression的应用之 -- 用CSS做出双色相间表格

      expression的应用之 -- 用CSS做出双色相间表格

      HTML&CSS

    • 0
    • 0
    • 0
    • 67
    • 单栏布局 侧栏位置: