没有合适的资源?快使用搜索试试~ 我知道了~
网站前端——导航( 同一页面导航切换到不同分页面)
1星 需积分: 42 75 下载量 40 浏览量
2017-09-15
22:55:34
上传
评论 4
收藏 3KB TXT 举报
温馨提示
试读
3页
这是一个网站前端,在同一页面,导航切换道不同分页面。用到bootstrap框架,不需要CSS、JS文件。将文档复制即可使用。
资源推荐
资源详情
资源评论
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>导航切换页面</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
<!--导航――bootstrap选项卡-->
<div class="tabbable" id="nav0">
<ul class="nav nav-tabs ">
<li class="active"><a href="#nav1" data-toggle="tab">首页</a></li>
<li><a href="#nav2" data-toggle="tab">第二页</a></li>
<li><a href="#nav3" data-toggle="tab">第三页</a></li>
</ul>
<!--导航内容-->
<div class="tab-content">
<!--第一页-->
<div class="tab-pane active" id="nav1">
内容
</div>
<!--第二页-->
<div class="tab-pane" id="nav2">
<div class="row clearfix">
<html>
<head>
<meta charset="UTF-8">
<title>导航切换页面</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
<!--导航――bootstrap选项卡-->
<div class="tabbable" id="nav0">
<ul class="nav nav-tabs ">
<li class="active"><a href="#nav1" data-toggle="tab">首页</a></li>
<li><a href="#nav2" data-toggle="tab">第二页</a></li>
<li><a href="#nav3" data-toggle="tab">第三页</a></li>
</ul>
<!--导航内容-->
<div class="tab-content">
<!--第一页-->
<div class="tab-pane active" id="nav1">
内容
</div>
<!--第二页-->
<div class="tab-pane" id="nav2">
<div class="row clearfix">
资源评论
- CapRobin2019-07-30真是坑爹啊 一个页面自己写个第几页就叫显示不同的页面了?真是搞笑...........
- qq_365044462018-08-30这还要分?搞笑的
甲or乙
- 粉丝: 8
- 资源: 6
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功