摘要：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="css/layui.css" /> <script type="text/javascript&
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/layui.css" />
<script type="text/javascript" src="js/layui.js"></script>
<title></title>
<style>
input {
margin-top: 3px;
}
</style>
</head>
<body style="background: #1E9FFF;">
<div style="width: 500px; margin: 100px auto 0px;">
<div style="background: #fff;border-radius: 4px;box-shadow: 5px 5px 20px #4444;padding: 20px;">
<form class="layui-form" style="color: #aaa;">
<div class="layui-form-item">
<h2>后臺管理系統(tǒng)</h2>
</div>
<hr />
<label class="layui-form-label">用戶名</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="請輸入用戶名" class="layui-input">
</div>
<label class="layui-form-label">密 碼</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="請輸入密碼" class="layui-input">
</div>
<label class="layui-form-label">密碼框</label>
<div class="layui-input-inline">
<input type="password" name="password" required lay-verify="required" placeholder="驗證碼" autocomplete="off" class="layui-input">
<img src="" />
</div>
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formDemo">登錄</button>
</div>
</form>
</div>
</div>
</body>
</html>
<!--引入框架css與js添加相應(yīng)的屬性名進行控制模塊 從而快速搭建節(jié)省時間-->
批改老師：天蓬老師批改時間：2019-01-28 09:12:24
老師總結(jié)：layUI做為現(xiàn)在國內(nèi)比較流行的一個前端框架, 其主要功能用在后臺的搭建上, 內(nèi)置了非常多的樣式可以用, 并且 還提供了一個后臺模板的成品, 可以直接套用的.