<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>demo-page</title>
    <!--    <style>-->
    <!--        .table > tbody > tr {-->
    <!--        text-align: left;-->
    <!--        }-->
    <!--    </style>-->
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css">
</head>

<script src="./jquery/jquery.min.js"></script>
<!-- Bootstrap 3.3.7 -->
<script src="./bootstrap/dist/js/bootstrap.min.js"></script>
<!-- bootstrap-table -->
<script src="./bootstrap-table/dist/bootstrap-table.js"></script>
<script src="./bootstrap-table/dist/locale/bootstrap-table-zh-CN.js"></script>

<body>
<!-- <div 水平排列导航 class="nav nav-pills"></div> -->
<!-- <nav>
	<div class="container">
		<ul class="nav nav-pills nav-stacked" role="tablist" style="width:10% ;">
			<li role="presentation" class="active"><a href="#">ios</a></li>
			<li role="presentation"><a href="#">ios2</a></li>
			<li role="presentation"><a href="#">ios3</a></li>
		</ul>
		
	</div>
	
	
</nav> -->

<div class="container">
	<div>
		<ul class="nav nav-pills nav-stacked" role="tablist" style="width: 10% ;">
			<li role="presentation" class="active"><a href="#">ios</a></li>
			<li role="presentation"><a href="#">ios2</a></li>
			<li role="presentation"><a href="#">ios3</a></li>
		</ul>
	</div>
	<div class="table-responsive" >
	
				<table class="table " style=width: 90%;">
				    <tr>
				        <th>#</th>
				        <th>First Name</th>
				        <th>List Name</th>
				        <th>Username</th>
				    </tr>
				    <tr class="success">
				        <td>1</td>
				        <td>Mark</td>
				        <td>Otto</td>
				        <td>@mdo</td>
				    </tr>
				    <tr>
				        <td>2</td>
				        <td>Jacob</td>
				        <td>Thornton</td>
				        <td>@fat</td>
				    </tr>
				    <tr>
				        <td>3</td>
				        <td>Larry</td>
				        <td>this Bird</td>
				        <td>@twitter</td>
				    </tr>
				</table>
			</div>
	
	    </div>
	
	</div>
	<div>




</body>

</html>

效果:注意css使用3.x。5.x好多不稳定

表单入门:

https://www.runoob.com/bootstrap/bootstrap-tables.html

bootstrap导航和table_jquery