摘要：<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> &
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/im/static/layui/css/layui.css">
<script type="text/javascript" src="/im/static/layui/layui.js "></script>
<meta charset="utf-8">
<title>登陆</title>
<style type="text/css">
*{margin: 0px;padding: 0px;}
.logo{text-align: center;margin: 20px;}
.logo img{width:80px;}
.btn{
width:50px;
height: 50px;
background-color: rgb(14,148,248);
text-align: center;
margin:0px auto;
border-radius: 50%;
line-height: 50px;
transform: rotate(180deg);
color: #fff;
}
.user_reg_passwd {
text-align: center;
font-size: 12px;
}
.login_service {
text-align: center;
font-size: 10px;
color: #666;
}
.mt20{margin-top: 20px;}
/*登陆边框*/
.layui-input{border-radius: 20px!important;}
</style>
</head>
<body>
<div class="logo">
<img src="static/image/logo.png" alt="QQ登陆">
</div>
<div class="layui-container layui-form">
<div class=" layui-form-item">
<input type="text" name="qq" placeholder="请输入QQ号码！" class="layui-input">
</div>
<div class="layui-form-item">
<input type="password" name="password" placeholder="请输入QQ密码！" class="layui-input">
</div>
<div class="btn" onclick="dologin();">
<i class="layui-icon layui-icon-return"></i>
</div>
<div class="layui-row mt20">
<div class="layui-col-xs6 user_reg_passwd">忘记密码</div>
<div class="layui-col-xs6 user_reg_passwd">用户注册</div>
<div class="layui-col-xs12 login_service mt20">登陆即代表阅读并同意服务条款</div>
</div>
</div>
</body>
</html>
<script type="text/javascript">
layui.use(['layer'],function(){
$ = layui.jquery;
var layer = layui.layer;
});
function dologin(){
var qq = $("input[name='qq']").val();
var password = $("input[name='password']").val();
$.post('/im/server/login.php',{qq:qq,password:password},function(res){
if(res.status==0){
layer.msg(res.msg,{icon:2});
}else if (res.status==1){
layer.msg(res.msg,{icon:1},function(){
window.location.href = 'index.php';
});
}
},'json')
}
</script>
批改老师：查无此人批改时间：2019-05-05 09:17:04
老师总结：完成的不错。layui框架很不错，跟bootstrap都是非常好的前端框架。继续加油。
