表单划过变换颜色

来源：互联网发布：windows系统购买编辑：程序博客网时间：2024/05/17 00:15
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   <html xmlns="http://www.w3.org/1999/xhtml">   <head>   <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   <title>FireFox / Mozilla / Opera / IE 适用</title>   <style type="text/css" by tesion.>   /* CSS v.02 by tesion.   CopyRight: http://www.netjoin.net  Contact: renziweb@hotmail.com  原创表单变色  */  /*定义全局样式 */  input,select,textarea,div   {       font: 12px Arial       /* 此部分为表单和容器的字体定义 */      }   /* 所有表单定义默认 */  input,select,textarea   {       border: 1px solid #EFEFEF;       }   /* 利用鼠标事件 :hover 来定义当鼠标经过时样式 */  input:hover,select:hover,textarea:hover {       background: #F0F9FB;       border: 1px solid #1D95C7;       }   /* 由于 :hover 事件只有 Mozilla 支持，因此为方便IE使用 expression 批量定义 */  input,select,textarea {       tesion:expression(onmouseover=function()        {this.style.backgroundColor="#F0F9FB";this.style.border="1px solid #1D95C7"},        onmouseout=function()       {this.style.backgroundColor="#FFFFFF";this.style.border="1px solid #EFEFEF"})       }   /* 如上 */  div {       background: #EFEFEF;       padding: 10px; /* 填充 */      cursor: pointer /* 鼠标 */      }   div:hover   {       background: #F0F9FB       }   div {       tesion:expression(onmouseover=function()        {this.style.backgroundColor="#F0F9FB"},        onmouseout=function()       {this.style.backgroundColor="#EFEFEF"})       }    /* 不错吧？ */  </style>   </head>   <body>   <p>     <input type="text" size="20" maxlength="16" />     <br />     <select name="select">     </select>     <br />     <textarea name="textarea"></textarea>   </p>   <div>这么简单</div>   </body>   </html>
0 0