表单控件样式简单用例

来源:互联网 发布:游戏王 决斗 知乎 编辑:程序博客网 时间:2024/06/11 00:11

 在很多文件和有很多的文本框的时候,我想在style.css文件中写上修饰文本框的样式,那么就能只要在每个文件中有:  
  <style   type="text/css">  
  <!--  
  @import   url("css/style.css");  
  -->  
  </style>   
  这样这个文件中的所有文本框都能统一的得到修饰

 

CSS中写:  
  INPUT  
  {  
  behavior:url('Input.htc');          
  }  
  Input.htc中内容://如果有特殊用途的INPUT存在可以判断className  
  <script   language=javascript>  
  switch(type)  
  {  
  case   'text':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#FFFFFF";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  case   'password':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#DEE3BD";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  case   'submit':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#DEE3BD";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#FF0000";  
  break;  
  case   'reset':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#DEE3BD";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  case   'button':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#DEE3BD";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  case   'file':  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#FFFFFF";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  default:  
  style.border="1px   solid   #000000";  
  style.backgroundColor="#DEE3BD";  
  style.height="15px";  
  style.font="normal   9pt   宋体";  
  style.color="#000000";  
  break;  
  };  
  onmousedown=function()  
  {  
  style.color="#0000FF";  
  };  
  onmouseover=function()  
  {  
  style.color="#0000FF";  
  };  
  onmouseout=function()  
  {  
  if(type=="submit")  
  {style.color="#FF0000";}  
  else  
  {style.color="#000000";}  
  };  
  </script>

原创粉丝点击