摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" h
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" href="layui/css/layui.css"> <script src="layui/layui.js"></script> <title>后台ui登录界面</title> </head> <body style="background:skyblue;"> <div style="width:400px; margin:300px auto 0px;"><!--不给高度，让内容撑开，嵌套div这样使用layui时更稳定--> <div style="background:#fff; border-radius: 4px; box-shadow: 5px 5px 20px #cccc;width:400px; padding:20px;"> <form class="layui-form"> <div class="layui-form-item" style="color:gray;"> <h2>后台管理系统</h2> </div> <hr> <div class="layui-form-item"> <label class="layui-form-label">用户名</label> <div class="layui-input-block"> <input type="text" placeholder="请输入用户名" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码框</label> <div class="layui-input-block"> <input type="password" placeholder="请输入密码" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">验证码</label> <div class="layui-input-inline"> <input type="text" class="layui-input"> </div> <div class="layui-form-mid layui-word-aux">辅助文字</div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> </div> </form> </div> </div> <!--总结： layui的class已经内置了，使用时找到对应的代码，复制粘贴即可， 注意的是的比如 表单必须依赖加载模块：form （请注意：如果不加载form模块，select、checkbox、radio等将无法显示，并且无法使用form相关功能）； 比如轮播模块加载名称：carousel。 --> </body> </html>
批改老师：韦小宝批改时间：2019-03-11 17:33:16
老师总结：使用layui来搭建后端管理系统是特别方便的 使用layui就是特别适合用于按钮输入框比较多的页面 就好比这个登录页
