边框特效

最新推荐文章于 2024-12-18 11:51:46 发布

最新推荐文章于 2024-12-18 11:51:46 发布 · 115 阅读

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Untitled Document</title> <style> div{ width: 300px; height: 30px; margin:4px; padding-top:8px; } .in_put{ border:1px dashed #CC00CC; background-color: #FFFF33; } .out{ border:0px; background-color: #FFFFFF; } </style> <script> function doFocus(idx) { document.getElementById(idx).className = "in_put"; } function doBlur(idx) { document.getElementById(idx).className = "out"; } </script> </head> <body> <center> <div id="input1"> 用户名：<input id="t1" onfocus="doFocus('input1');" onblur="doBlur('input1');"/> </div> <div id="input2"> 邮箱：<input id="t2" onfocus="doFocus('input2');" onblur="doBlur('input2');"/> </div> </center> </body> </html>