<html > <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <script language="jscript"> function check(){ var name=myform.txtN.value; var pass = myform.txtP.value; if(name.length==""||pass.length==""){ alert("用户名或密码不能为空！"); return false; } if(pass.length<6||name.length<6){ alert("密码或用户名长度要6位以上"); return false; } for(var i = 0;i<name.length;i++){ name=name.toLowerCase().charAt(i); if(!(name>='0'&&name<='9')&&!(name>='a'&&name<='z')){ alert("用户名必须只能由数字和字母组成"); return false; } } return true; } </script> <title>css样式特效</title> <style type="text/css"> table{ font-size:12px; } .mouseOverStyle{ background-image:url(img/excer/images1/freedl_1-2.jpg); border:0px; padding:0px; margin:0px; height:24; width:102; font-size:12px; } .mouseOver{ background-image:url(img\excer\images1\freedl_1-1.jpg); border:0px; margin:0px; padding:0px; height:24; width:102; font-size:12px; } .mouseOut{ ` background-image:url(img\excer\images1\freedl_1-2.jpg); border:0px; margin:0px; padding:0px; height:24; width:102; font-size:12px; } </style> </head> <body> <form name="myform" method="post" action="a.htm" onSubmit="return check()"> <table border="0" bgcolor="#F8F8F8" style="border-style:solid; border-width:1px;"> <tr> <td colspan="2"><img src="img/excer/images1/freeh1-n.jpg" alt="1" ></td> </tr> <tr> <td width="72"><label></label> <div align="right">用户名：</div></td> <td width="240"><label> <input type="text" name="txtN" style="border-color='#00a8a8'" onMouseOver="this.style.borderColor='#ffa346';" onMouseOut="this.style.borderColor='#00a8a8'"> </label> <br>名字由字母和数字组成</td> </tr> <tr> <td><div align="right">密码：</div></td> <td><label> <input type="password" name="txtP" style=" border-color:#00a8a8" onMouseOver="this.style.borderColor='#ffa346';" onMouseOut="this.style.borderColor='#00a8a8'" > </label> </td> </tr> <tr> <td> </td> <td><label>密码长度6位以上</label></td> </tr> <tr> <td> </td> <td><label> <input type="submit" name="Submit" value=" 登录 " class="mouseOverStyle" onMouseOver="this.className='mouseOver'" onMouseOut="this.className='mouseOut'" > </label> </td> </tr> </table> </form> </body> </html>
温馨提示：答案为网友推荐，仅供参考