bootstrap-admin
/
index.html

<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<!--The content below is only a placeholder and can be replaced.-->

		<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
	<link rel="stylesheet" href="css/basic.css">
		<nav class="navbar navbar-inverse" role="navigation">
			<div class="container-fluid">
				<div class="navbar-header">

					<a href="" class="navbar-brand">LOGO</a>

				</div>
				<div class="collapse navbar-collapse" id="example-navbar-collapse">
					<ul class="nav navbar-nav">

						<li class="active">
							<a href="#">商品管理</a>
						</li>
						<li class="active">
							<a href="#">系统设置</a>
						</li>
					</ul>
					<ul class="nav navbar-nav navbar-right">
						<li>
							<a>欢迎您,admin</a>
						</li>
						<li>
							<a href="#">安全退出</a>
						</li>
					</ul>
				</div>
			</div>
		</nav>

		<div class="container-fluid">
			<div class="row">
				<div class="col-sm-2">
					<a href="#" class="list-group-item active">商品管理</a>

					<a href="/" class="list-group-item">
						商品列表</a>
					<a href="edit.html" class="list-group-item">
						增加商品</a>

					<a href="#" class="list-group-item active">分类管理</a>

					<a href="/" class="list-group-item">
						商品分类列表</a>
					<a href="/add" class="list-group-item">
						增加商品分类</a>

				</div>
				<div class="col-sm-10">
					<ol class="breadcrumb">
						<li class="active">商品管理
						</li>
						<li class="active">商品列表
						</li>
					</ol>
					<div class="panel panel-default">
						<div class="panel-heading">
							搜索
						</div>
						<div class="panel-body">
							<form role="form" class="form-inline">
								<div class="form-group">
									<label for="name">名称</label>
									<input type="text" class="form-control" id="name" placeholder="请输入名称">
								</div>

								<div class="form-group">
									<button type="submit" class="btn btn-default">开始搜索</button>
								</div>
							</form>
						</div>
					</div>
					<!--
                列表展示
            -->
					<div class="table-responsive">
						<table class="table table-striped ">
							<thead>
								<tr>
									<th>编号</th>
									<th>图标</th>
									<th>名称</th>
									<th>价格</th>
									<th>邮费</th>

									<th class="text-center">操作</th>
								</tr>
							</thead>
							<tbody>

								<tr>
									<td>1</td>
									<td>图标</td>
									<td>背包1111111</td>
									<td>20元</td>
									<td>10元</td>

									<td class="text-center">
										<button type="button" class="btn btn-primary">修改</button>
										<button type="button" class="btn btn-danger">删除</button>
									</td>
								</tr>
								<tr>
									<td>2</td>
									<td>图标</td>
									<td>thinpad笔记本电脑</td>
									<td>20元</td>
									<td>10元</td>

									<td class="text-center">
										<button type="button" class="btn btn-primary">修改</button>
										<button type="button" class="btn btn-danger">删除</button>
									</td>
								</tr>
								<tr>
									<td>3</td>
									<td>图标</td>
									<td>iphone7</td>
									<td>20元</td>
									<td>10元</td>

									<td class="text-center">
										<button type="button" class="btn btn-primary">修改</button>
										<button type="button" class="btn btn-danger">删除</button>
									</td>
								</tr>

							</tbody>
						</table>
					</div>

				</div>
			</div>
		</div>

	</body>

</html>