摘要:使用layui做后台登陆页面<!DOCTYPE html><html><head> <title>后台登录</title> <link rel="stylesheet" type="text/css" href="layui/css/layui.css"> <s
使用layui做后台登陆页面
<!DOCTYPE html>
<html>
<head>
<title>后台登录</title>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<script type="text/javascript" src="layui/layui.js"></script>
</head>
<body style="background: #1E9FFF">
<div style="width: 500px;margin:200px auto;">
<div style="background: #fff;border-radius: 4px;box-shadow: 5px 5px 20px #4444;padding: 20px">
<form class="layui-form" action="">
<div class="layui-form-item" style="color: gray">
<h2>后台管理</h2>
<hr> <!-- 底部横线 -->
</div>
<div class="layui-form-item">
<label class="layui-form-label">用戶名</label>
<div class="layui-input-block">
<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密碼</label>
<div class="layui-input-block">
<input type="text" name="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">验证手机</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">验证码</label>
<div class="layui-input-inline">
<input type="text" name="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
<img src="../mI/static/images/ghs.png">
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
<!-- <div class="layui-inline">
<label class="layui-form-label">验证码</label>
<div class="layui-input-inline">
<input type="text" name="" lay-verify="" autocomplete="off" class="layui-input">
<img src="../mI/static/images/footericon1.png">
</div>
</div> -->
</div>
</form>
</div>
</div>
</body>
</html>
批改老师:天蓬老师批改时间:2018-12-29 09:22:19
老师总结:密码输入框的type不是text,是password,页面写完后,最好测试一下,看看是否符合你的预期