摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>登录</title> <link rel="stylesheet" type="text/css"
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>登录</title> <link rel="stylesheet" type="text/css" href="../static/layui/css/layui.css"> <script type="javascript" href="../static/layui/layui.js"></script> </head> <body style="background: #0f7ed0"> <div style="width: 320px;margin: 150px auto"> <h2 style="color: #fff;font-size: 35px;text-align: center;margin-bottom: 20px;">admin</h2> <div style="width: 300px;background: #58a7dd;box-shadow: 0px 0px 10px #424242;padding: 10px;"> <form class="layui-form"> <div class="layui-form-inline"> <label class="layui-form-label" style="color: #fff;font-weight: bolder;">用户名：</label> <div class="layui-input-inline"> <input class="layui-input" type="text" placeholder="请输入用户名"> </div> </div> <hr> <div class="layui-form-inline" style="padding-top: 10px;"> <label class="layui-form-label" style="color: #fff;font-weight: bolder;">密码：</label> <div class="layui-input-inline"> <input class="layui-input" type="text" placeholder="请输入密码"> </div> </div> <hr> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-filter="demo1" lay-submit="">登录</button> </div> </div> </form> </div> </div> </body> </html>
layui可以快速完成页面的布局，节省了布局时间，配置简单轻便。
效果：
批改老师：灭绝师太批改时间：2019-01-04 09:25:37
老师总结：是的 要快速熟悉组件，学会看文档哟！继续加油！
