master

分支 (1)

管理

管理

master

book
/
book_list.html

<!DOCTYPE html>
<html>
	<head>
	  <meta charset="utf-8">
	  <meta http-equiv="X-UA-Compatible" content="IE=edge">
	  <meta name="viewport" content="width=device-width, initial-scale=1">
	  <title>图书列表</title>
	  <!-- Bootstrap -->
	  <link href="dist/css/bootstrap.css" rel="stylesheet">
	  <style type="text/css">
	  	#login{
			height: 40px;
			display: flex;
			flex-wrap: nowrap;
			flex-direction: row;
			justify-content: center;
			align-items: center;
		}
	  </style>
	</head>
	<body>
		<div class="container-fluid">
			<div class="row">
				<div class="col-lg-6"></div>
				<div class="col-lg-6">
					<div class="row">
						<div class="col-lg-6"></div>
						<div class="col-lg-6">
							<div class="row">
								<div class="col-lg-6"></div>
								<div class="col-lg-6" style="height: 40px;">
									<div class="dropdown" style="float: right;">
									  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
									    H
									   <span class="caret"></span>
									  </button>
									  <ul class="dropdown-menu" aria-labelledby="dropdownMenu1" style="min-width: 50px;">
									    <li><a href="#">注销</a></li>
									  </ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="container" style="margin-top: 10px;">
			<h1 class="text-center">图书列表</h1>
		</div>
		<div class="container">
			<table class="table table-hover">
				<thead>
					<tr>
						<th>图书ID</th>
						<th>图书名称</th>
						<th>图书作者</th>
						<th>图书分类</th>
						<th>图书价格</th>
						<th colspan="2" class="text-center">操作</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>1001</td>
						<td>西游记</td>
						<td>吴承恩</td>
						<td>历史</td>
						<td>99.99</td>
						<td class="text-center">
							<a onclick="if(confirm('确定要删除吗?')){return true;}else{return false;}" class="btn btn-primary" href="#">删除</a>
						</td>
						<td class="text-center">
							<a class="btn btn-primary" href="book_update.html">更新</a>
						</td>
					</tr>
					<tr>
						<td>1001</td>
						<td>西游记</td>
						<td>吴承恩</td>
						<td>历史</td>
						<td>99.99</td>
						<td class="text-center">
							<a onclick="if(confirm('确定要删除吗?')){return true;}else{return false;}" class="btn btn-primary" href="#">删除</a>
						</td>
						<td class="text-center">
							<a class="btn btn-primary" href="book_update.html">更新</a>
						</td>
					</tr>
					<tr>
						<td>1001</td>
						<td>西游记</td>
						<td>吴承恩</td>
						<td>历史</td>
						<td>99.99</td>
						<td class="text-center">
							<a onclick="if(confirm('确定要删除吗?')){return true;}else{return false;}" class="btn btn-primary" href="#">删除</a>
						</td>
						<td class="text-center">
							<a class="btn btn-primary" href="book_update.html">更新</a>
						</td>
					</tr>
					<tr>
						<td>1001</td>
						<td>西游记</td>
						<td>吴承恩</td>
						<td>历史</td>
						<td>99.99</td>
						<td class="text-center">
							<a onclick="if(confirm('确定要删除吗?')){return true;}else{return false;}" class="btn btn-primary" href="#">删除</a>
						</td>
						<td class="text-center">
							<a class="btn btn-primary" href="book_update.html">更新</a>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div class="container">
			<a href="book_add.html">添加图书</a> |
			<a href="#">图书导出</a>
		</div>
		<div class="container">
			<nav aria-label="Page navigation" class="text-right">
			  <ul class="pagination">
			    <li>
			      <a href="#" aria-label="Previous">
			        <span aria-hidden="true">&laquo;</span>
			      </a>
			    </li>
			    <li><a href="#">1</a></li>
			    <li><a href="#">2</a></li>
			    <li><a href="#">3</a></li>
			    <li><a href="#">4</a></li>
			    <li><a href="#">5</a></li>
			    <li>
			      <a href="#" aria-label="Next">
			        <span aria-hidden="true">&raquo;</span>
			      </a>
			    </li>
			  </ul>
			</nav>
		</div>

		<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
		<script src="js/jquery.js"></script>
		<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
		<script src="dist/js/bootstrap.js"></script>
	</body>
</html>