您的位置：首页 > Web前端 > BootStrap

bootstrap开发tab选项卡事例

2014-12-27 09:25 197 查看
<html>

<head>

<title>选项卡</title>

<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width,initial-scale=1" />

<link href="../book/css/bootstrap.css" rel="stylesheet" type="text/css" />

<script src="../file/jquery.js" type="text/javascript"></script>

<script src="../book/js/bootstrap.js" type="text/javascript"></script>

</head>

<body>

<ul class="nav nav-tabs">

<li><a href="#home" data-toggle="tab">Home</a></li>

<li><a href="#profile" data-toggle="tab">Profile</a></li>

<li><a href="#message" data-toggle="tab">Message</a></li>

<li><a href="#set" data-toggle="tab">Set</a></li>

</ul>

<div class="tab-content">

<div class="tab-pane active" id="home">home</div>

<div class="tab-pane" id="profile">profile</div>

<div class="tab-pane" id="message">message</div>

<div class="tab-pane" id="set">set</div>

</div>

</body>

</html>

效果：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航