管理员页面布局(layui表格)

摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>admin.html</title>  <link rel="styl
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>admin.html</title>
<!-- 引入layui样式文件 -->
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<!-- 引入layui基础核心库 -->
<script type="text/javascript" src="layui/layui.js"></script>
<style>
.header span{background: #009688;color:#fff;padding: 10px;margin-left: 30px;line-height: 32px;}
.header button{float: right;}
.header{border-bottom: 2px #009688 solid;}
</style>
</head>
<body style="padding: 10px;">
	<div class="header">
		<span>管理员列表</span>
		<button class="layui-btn  layui-btn-sm">添加</button>
	</div>

	<table class="layui-table">
  		<thead>
		    <tr>		      
		      <th >姓名</th>
		      <th >性别</th>
		      <th >民族</th>
		      <th >生日</th>
		      <th >城市</th>		      		      
		      <th >职业</th>
		      <th >操作</th>		     	     
		    </tr>
  		</thead>

  		 <tbody>
		      <tr>
		        <td>成龙</td>
		        <td>男</td>
		        <td>汉族</td>
		        <td>1954-04-07</td>
		        <td>香港</td>
		        <td>演员、导演</td>
		        <td>
					<button class="layui-btn ">编辑</button>
   				    <button class="layui-btn" onclick="del()">删除</button>
		        </td>
		      </tr>
		      <tr>
		        <td>刘德华</td>
		        <td>男</td>
		        <td>汉族</td>
		        <td>1961-09-27</td>
		        <td>香港</td>
		        <td>歌手、演员</td>
		        <td>
					<button class="layui-btn ">编辑</button>
   				    <button class="layui-btn" onclick="del()">删除</button>
		        </td>
		       
		      </tr>
		      <tr>
		        <td>周杰伦</td>
		        <td>男</td>
		        <td>汉族</td>
		        <td>1979-01-18</td>
		        <td>台湾</td>
		        <td>歌手</td>
		        <td>
					<button class="layui-btn ">编辑</button>
   				    <button class="layui-btn" onclick="del()">删除</button>
		        </td>
		       
		      </tr>
		      <tr>
		        <td>郭富城</td>
		        <td>男</td>
		        <td>汉族</td>
		        <td>1965-10-26</td>
		        <td>香港</td>
		        <td>歌手、演员</td>
		        <td>
					<button class="layui-btn ">编辑</button>
   				    <button class="layui-btn" onclick="del()">删除</button>
		        </td>
		       
		      <tr>
		        <td>周润发</td>
		        <td>男</td>
		        <td>汉族</td>
		        <td>1955-05-18</td>
		        <td>香港</td>
		        <td>演员</td>
		        <td>
					<button class="layui-btn ">编辑</button>
   				    <button class="layui-btn" onclick="del()">删除</button>
		        </td>
		        
		      </tr>
    </tbody>
	</table>

	<script>
	layui.use(['layer'], function(){	  
	  var layer = layui.layer;	
	  }); 

		function del(){
		layer.confirm('确定要退出吗？', {
		icon:2,
	  btn: ['确定', '取消'] //可以无限个按钮
	  
	}, function(index, layero){
	  //按钮【按钮一】的回调
	}, function(index){
	  //按钮【按钮二】的回调
	});
	}
</script>
</body>
</html>
批改老师：查无此人批改时间：2018-12-22 10:59:22
老师总结：理解的不错。如果作业能写上你自己的看法，我能给你更好的建议。
管理员页面布局(layui表格)

热门词条
