LAYUI表单模块

原创2019-08-09 12:54:4793
摘要:<!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> 


批改老师:Peter-Zhu批改时间:2019-08-15 10:43:16
老师总结:最好配张图, 这样才看起来更形象, 你说呢

发布手记

热门词条

第九期线上培训班