style.css
.table{
width:80%;
margin: 0 auto;
align: center;
}
#search-form{
width: 80%;
margin: 0 auto;
align: center;
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>公司内部文件搜索</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="../styles/index.css">
</head>
<body><h3 align="center"> 公司内部文件搜索</h3>
<table class="table table-bordered">
<thead>
<tr>
<th>文件名称</th>
<th>文件大小</th>
<th>创建者</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="../files/test1.txt">test1.txt</a></td>
<td>1kb</td>
<td>admin</td>
</tr>
<tr>
<td><a href="../files/test1.txt">test1.txt</a></td>
<td>1kb</td>
<td>admin</td>
</tr>
<tr>
<td><a href="../files/test1.txt">test1.txt</a></td>
<td>1kb</td>
<td>admin</td>
</tr>
<tr>
<td><a href="../files/test1.txt">test1.txt</a></td>
<td>1kb</td>
<td>admin</td>
</tr>
<tr>
<td><a href="../files/test1.txt">test1.txt</a></td>
<td>1kb</td>
<td>admin</td>
</tr>
</tbody>
</table>
<form class="form-inline" role="form" id="search-form">
<div class="checkbox">
<label>文件搜索:</label>
</div>
<div class="form-group">
<label class="sr-only" >名称</label>
<input type="search" class="form-control" id="search-file" name="query"
placeholder="请输入名称">
</div><button type="submit" class="btn btn-default">提交</button>
</form>
</body>
</html>