后台登录页面

原创 2019-02-12 22:56:01 437
摘要:<!DOCTYPE html><html><head> <title>登录</title> <!-- 引入核心样式文件 --> <link rel="stylesheet" type="text/css" href="../static/plugins/layui/css

<!DOCTYPE html>

<html>

<head>

<title>登录</title>

<!-- 引入核心样式文件 -->

<link rel="stylesheet" type="text/css" href="../static/plugins/layui/css/layui.css">

<script type="text/javascript" src="../static/plugins/layui/layui.js"></script><!-- 引入基础核心库 -->

</head>

<body style="background:#1E9FFF">

<div style="width: 500px;margin:270px auto 0px; ">

<div style="background: #fff; border-radius: 4px;box-shadow: 5px 5px 20px #4444;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="text"  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>

  <img src="../yz.png">

</div>

<div class="layui-form-item">

    <div class="layui-input-block">

      <button class="layui-btn" lay-submit lay-filter="formDemo">登录</button>

    </div>

</div>

</form>

</div>

</div>

</body>

</html> 


批改老师:韦小宝批改时间:2019-02-13 10:15:54
老师总结:写的很不错 使用layui来完成后台登录页面太简单不过了 layui还是比较灵活的 没事可以多去研究研究!

发布手记

热门词条