构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（3）2014-08-10漂亮系统登陆界面良好的登录页面是系统的唯一入口，良心说，我是很难做出漂亮的登录界面，所以有点违背本文的标题，因为我不是一个美工。汗..！第二讲我已经发布了源码,我们添加一个Account空控制器,虽然后台未实现，但是以后我们就要用到了。添加index视图，以下代码
@{Layout = null;}<！DOCTYPE html><html><head><title>系统登录</title><script src="/Scripts/jquery.min.js" type="text/javascript"></script>@Styles.Render（"~/Content/themes/blue/css"）<link href="~/Content/Site.css" rel="stylesheet"/><style type="text/css">body{letter-spacing: 1px;color: #444;}#LoginTb{font-size: 14px;}#LoginTb{font-size: 12px;}#LoginTb input{width: 190px;height: 24px;line-height: 24px;}</style><script type="text/javascript">$（function （） {$（"#LoginSys"）.click（function （） {LoginSys（）;}）;$（"#UserName"）.keydown（function （e） {var curkey = e.which;if （curkey == 13） {LoginSys（）;return false;}}）;$（"#Password"）.keydown（function （e） {var curkey = e.which;if （curkey == 13） {LoginSys（）;return false;}}）;$（"#ValidateCode"）.keydown（function （e） {var curkey = e.which;if （curkey == 13） {LoginSys（）;return false;}}）;}）;function LoginSys（） {$（"#mes"）.html（""）;$（"#UserName"）.removeClass（"input-validation-error"）;$（"#Password"）.removeClass（"input-validation-error"）;$（"#ValidateCode"）.removeClass（"input-validation-error"）;if （$.trim（$（"#UserName"）.val（）） == ""） {$（"#UserName"）.addClass（"input-validation-error"）.focus（）;$（"#mes"）.html（"用户名不能为空！"）;return;}if （$.trim（$（"#Password"）.val（）） == ""） {$（"#Password"）.addClass（"input-validation-error"）.focus（）;$（"#mes"）.html（"密码不能为空！"）;return;}if （$.trim（$（"#ValidateCode"）.val（）） == ""） {$（"#ValidateCode"）.addClass（"input-validation-error"）.focus（）;$（"#mes"）.html（"验证码不能为空！"）;return;}$（"#Loading"）.show（）;alert（1）;return false;} </script></head><body><div><div class="define-head" style="height: 67px;"><div class="define-logo"><div id="LoginTopLine">YmNets.cnblogs.com</div><div id="LoginBotoomLine">MVC4+EF5.0+EasyUI</div></div></div></div><div style="margin: 0 auto; margin-top: 100px; width: 800px;"><table style="width: 800px; margin: 0 auto;"><tr><td><img src="/Content/Images/account.jpg"></td><td style="width: 310px;"><table id="LoginTb" style="margin-top: 10px; background: #fff; width: 100%; height: 230px; border: 1px #ccc solid;"><tr><td colspan="2" style="font-size: 18px;font-weight: bold; padding: 5px 20px;">欢迎登录</td></tr><tr><td style="width: 80px; text-align: right">用户名：</td><td><input id="UserName" name="UserName" type="text"/></td></tr><tr><td style="width: 80px; text-align: right;">密 码：</td><td><input id="Password" name="Password" type="password"/></td></tr><tr><td style="width: 80px; text-align: right">验证码：</td><td> </td></tr><tr><td colspan="2"><table style="width: 100%;"><tr><td style="width:40px;"> </td><td><div id="mes" class="field-validation-error"></div><div id="Loading" style="display: none" class="panel-loading"><font color="#000">加载中...</font></div></td><td style="width: 100px;"><a id="LoginSys" href="javascript:void（0）" class="easyui-linkbutton l-btn"><span class="l-btn-left"><span class="l-btn-text icon-ok" style="padding-left: 20px;">登录</span></span></a></td></tr></table></td></tr></table></td></tr></table></div><div style="background:#f1f1f1; height:40px; width:100%; text-align:center; line-height:40px;border-top:1px #ccc solid;bottom:0; position:absolute">Copyright ymnet2010-2013</div></body></html>运行效果效果图：http://localhost:1332/account
其实素材好难找。大家有好的素材不妨共享给我一下，谢谢啦...ymnets@sina.com或者修改好的源码作者：YmNets出处：http://ymnets.cnblogs.com/
易网时代-编程资源站