<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>标签页</title>
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery-3.2.1.js"> </script>
<script src="js/bootstrap.js"></script>
<script src="js/holder.js"></script>
</head>
<body>
<div class="container">
<h2 class="page-header">标签页</h2>
<ul class="nav nav-tabs">
<li><a href="#overwatch" data-toggle="tab"class="nav nav-success">守望先锋</a></li>
<li><a href="#palading"data-toggle="tab">枪火游侠</a></li>
<li><a href="#palagong"data-toggle="tab">虚幻争霸</a></li>
<li><a href="#stormheros"data-toggle="tab">风暴英雄</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane" id="overwatch">
<table class="table table-striped table-bordered table-condensed">
<tr class="success">
<th>虚幻争霸</th>
<th>守望先锋</th>
<th>枪火游侠</th>
<th>英雄联盟</th>
<th>神之浩劫</th>
</tr>
<tr class="info">
<th>腾讯代理</th>
<th>网易代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
</tr>
<tr class="active">
<th>上市:2017年</th>
<th>上市:2016年</th>
<th>上市:2017年</th>
<th>上市:2011年</th>
<th>上市:2015年</th>
</tr>
<tr class="warning">
<th>游戏类型:MOBA+FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:MOBA</th>
<th>游戏类型:MOBA+FPS</th>
</tr>
<tr class="danger">
<th>制作商:Epic Games</th>
<th>制作商:暴雪</th>
<th>制作商:Hi-Rez</th>
<th>制作商:拳头</th>
<th>制作商:Hi-Rez</th>
</tr>
</table>
</div>
<div class="tab-pane" id="palading">
<table class="table table-striped table-bordered table-condensed">
<tr class="success">
<th>虚幻争霸</th>
<th>守望先锋</th>
<th>枪火游侠</th>
<th>英雄联盟</th>
<th>神之浩劫</th>
</tr>
<tr class="warning">
<th>游戏类型:MOBA+FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:MOBA</th>
<th>游戏类型:MOBA+FPS</th>
</tr>
<tr class="danger">
<th>制作商:Epic Games</th>
<th>制作商:暴雪</th>
<th>制作商:Hi-Rez</th>
<th>制作商:拳头</th>
<th>制作商:Hi-Rez</th>
</tr>
</table>
</div>
<div class="tab-pane" id="palagong">
<table class="table table-striped table-bordered table-condensed">
<tr class="success">
<th>虚幻争霸</th>
<th>守望先锋</th>
<th>枪火游侠</th>
<th>英雄联盟</th>
<th>神之浩劫</th>
</tr>
<tr class="info">
<th>腾讯代理</th>
<th>网易代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
</tr>
<tr class="active">
<th>上市:2017年</th>
<th>上市:2016年</th>
<th>上市:2017年</th>
<th>上市:2011年</th>
<th>上市:2015年</th>
</tr>
<tr class="warning">
<th>游戏类型:MOBA+FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:FPS</th>
<th>游戏类型:MOBA</th>
<th>游戏类型:MOBA+FPS</th>
</tr>
<tr class="danger">
<th>制作商:Epic Games</th>
<th>制作商:暴雪</th>
<th>制作商:Hi-Rez</th>
<th>制作商:拳头</th>
<th>制作商:Hi-Rez</th>
</tr>
</table>
</div>
<div class="tab-pane" id="stormheros">
<table class="table table-striped table-bordered table-condensed">
<tr class="success">
<th>虚幻争霸</th>
<th>守望先锋</th>
<th>枪火游侠</th>
<th>英雄联盟</th>
<th>神之浩劫</th>
</tr>
<tr class="info">
<th>腾讯代理</th>
<th>网易代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
<th>腾讯代理</th>
</tr>
<tr class="active">
<th>上市:2017年</th>
<th>上市:2016年</th>
<th>上市:2017年</th>
<th>上市:2011年</th>
<th>上市:2015年</th>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
转载于:https://www.cnblogs.com/YoogaChan/p/6896276.html