简单的layui后台登录

原创 2019-05-14 21:51:40 304
摘要:<!DOCTYPE html> <html> <head> <title>layui后台登录</title> <link rel="stylesheet" type="text/css" href="static/layui/css/lay
<!DOCTYPE html>
<html>
<head>
	<title>layui后台登录</title>
	<link rel="stylesheet" type="text/css" href="static/layui/css/layui.css">
	<script type="text/javascript" src="static/layui/layui.js"></script>
</head>
<body style="background:#1E9FFF">
	<div style="width: 500px;margin:300px auto 0px;">
		<div style="background-color: #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" name="title" class="layui-input"> 
					</div>
				</div>
				<div class="layui-form-item">
					 <label class="layui-form-label">密&nbsp&nbsp&nbsp&nbsp码</label>
					 <div class="layui-input-block">
					  	<input type="text" name="title" class="layui-input"> 
					</div>
				</div>
				<div class="layui-form-item">
					 <label class="layui-form-label">验证码</label>
					 <div class="layui-input-inline">
					  	<input type="text" name="title" class="layui-input"> 
					</div>
					<p style="font-size: 29px;">验证码</p>
				</div>
				 <div class="layui-form-item">
				    <div class="layui-input-block">
				      <button class="layui-btn" lay-submit lay-filter="formDemo">登录</button>
				      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
				    </div>
			  </div>
			</form>
		</div>
	</div>
</body>
</html>

需要的功能都是对应的单词,记住部分功能的单子,就可以准确的在layui官方文档找到需要的功能;

批改老师:查无此人批改时间:2019-05-15 14:01:21
老师总结:完成的不错。layui框架很不错,看看文档。继续加油。

发布手记

热门词条

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号