Bootstrap的标签页

下面是Bootstrap的标签页,挺好的,但是用的id,内容是固定的?我不知道怎么变成不同的视图来

<!DOCTYPE html>

<html>

<head>

	<meta charset="utf-8">

	<title>Bootstrap 实例 - 标签页（Tab）插件</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>

</head>

<body>

<ul id="myTab" class="nav nav-tabs">

	<li class="active">

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

			 菜鸟教程

		</a>

	</li>

	<li><a href="#ios" data-toggle="tab">iOS</a></li>

	<li class="dropdown">

		<a href="#" id="myTabDrop1" class="dropdown-toggle"

		   data-toggle="dropdown">Java

			<b class="caret"></b>

		</a>

		<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">

			<li><a href="#jmeter" tabindex="-1" data-toggle="tab">jmeter</a></li>

			<li><a href="#ejb" tabindex="-1" data-toggle="tab">ejb</a></li>

		</ul>

	</li>

</ul>

<div id="myTabContent" class="tab-content">

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

		<p>菜鸟教程是一个提供最新的web技术站点，本站免费提供了建站相关的技术文档，帮助广大web技术爱好者快速入门并建立自己的网站。菜鸟先飞早入行——学的不仅是技术，更是梦想。</p>

	</div>

	<div class="tab-pane fade" id="ios">

		<p>iOS 是一个由苹果公司开发和发布的手机操作系统。最初是于 2007 年首次发布 iPhone、iPod Touch 和 Apple

			TV。iOS 派生自 OS X，它们共享 Darwin 基础。OS X 操作系统是用在苹果电脑上，iOS 是苹果的移动版本。</p>

	</div>

	<div class="tab-pane fade" id="jmeter">

		<p>jMeter 是一款开源的测试软件。它是 100% 纯 Java 应用程序，用于负载和性能测试。</p>

	</div>

	<div class="tab-pane fade" id="ejb">

		<p>Enterprise Java Beans（EJB）是一个创建高度可扩展性和强大企业级应用程序的开发架构，部署在兼容应用程序服务器（比如 JBOSS、Web Logic 等）的 J2EE 上。

		</p>

	</div>

</div>

</body>

</html>

适合.Net MVC的标签页

这个是我发现,MVC的官方例子就是写的这个,我直接拿来用了.样式可能有点丑,我没调.

下面我写了三个标签页,你在三个视图上面都加上就可以了

<div class="navbar-collapse collapse">

    <ul class="nav  nav-tabs">

        <li>@Html.ActionLink("仓库库存列表", "Index", "ProductStock")</li>

        <li>@Html.ActionLink("仓库列表", "Index", "ProductWarehouse")</li>

        <li>@Html.ActionLink("转仓记录", "Index", "ProductStockTransfer")</li>

    </ul>

</div>

.Net MVC 标签页的更多相关文章

  1. Bootstrap -- 插件: 模态框、滚动监听、标签页

    Bootstrap -- 插件: 模态框.滚动监听.标签页 1. 模态框(Modal): 覆盖在父窗体上的子窗体. 使用模态框: <!DOCTYPE html> <html> ...

  2. Angular实现多标签页效果(路由重用)

    1.需求 做了几年的MES系统,从ASP.NET WebForm至MVC,系统决定了用户界面必须为标签页方式实现,因为用户在进行一项操作的时候很有可能会进行其它的操作,比如查询之类的.如果按MVC的方 ...

  3. 最新 去掉 Chrome 新标签页的8个缩略图

    chrome的新标签页的8个缩略图实在让人不爽,网上找了一些去掉这个略缩图的方法,其中很多已经失效.不过其中一个插件虽然按照原来的方法已经不能用了,但是稍微变通一下仍然是可以用的(本方法于2017.1 ...

  4. 在QMainWindow中利用多个QDockWidget构成标签页tab（原创）

    功能描述: 在QMainWindow下,使用多个QDockWidget构成可切换,可拖动,可关闭的标签页:标签页的切换由相关联的QAction触发. 实现效果: 代码如下: QDockWidget * ...

  5. vim 标签页 tabnew 等的操作命令

    对于vim这个 ide来说, 单纯的用 多子窗口 来操作, 感觉还是不够的, 还要结合标签页tab pages来,才能更好的操作. 所有关于标签 的 命令行 命令都是 以 :tab开始的, 可以用ta ...

  6. Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”

    Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...

  7. EasyUI创建异步树形菜单和动态添加标签页tab

    创建异步树形菜单 创建树形菜单的ul标签 <ul class="easyui-tree" id="treeMenu"> </ul> 写j ...

  8. asp.net错误页和asp.net mvc错误页设置

    asp.net错误页 在日常项目开发过程中,我们需要给网站设置错误页和记录错误日志. 首先,在项目中添加全局应用程序类 在Global.asax中 protected void Application ...

  9. Tabio – 轻松，高效的管理 Chrome 标签页

    Tabio 是一个 Chrome 扩展,旨在简化大量浏览器标签页的管理.它提供的搜索功能允许您快速.轻松地找到您需要的选项卡.Tabio 便于组织你的标签,简单的拖拽排序.您也可以使用输入.删除和箭头 ...

随机推荐

  1. C++类分号（;）问题

    环境:vs2010 问题:今天编代码过程中发现好多很奇怪的错误,我以为昨天调了下编译器才出问题了.搞了好久,代码注释掉很多还是不行,并且错误还一直在变化.问题大概如下: (照片上传不了) .error ...

  2. oracel: 通过特殊表序列来实现oracle自增id (mybatis实现自增id)

    本项目结合mybaits来使用. 加入有一个用户表:sys_user, 自增id为user_id. 怎么来实现id的自增呢? 通过sql语句select * from user_sequences,检 ...

  3. C#格式化字符串使用

    1 前言 如果你熟悉Microsoft Foundation Classes(MFC)的CString,Windows Template Library(WTL)的CString或者Standard ...

  4. go条件变量同步机制

    sync.Cond代表条件变量,需要配置锁才能有用 package main import ( "fmt" "runtime" "sync" ...

  5. 自用ajxa 后台管理请求

    /** * 保存或者修改商品信息 * @returns */ function saveOrUpdateBaseGoodInfo(){ var json={}; var goodName=$.trim ...

  6. .net大文件分块上传断点续传demo

    IE的自带下载功能中没有断点续传功能,要实现断点续传功能,需要用到HTTP协议中鲜为人知的几个响应头和请求头. 一. 两个必要响应头Accept-Ranges.ETag 客户端每次提交下载请求时,服务 ...

  7. 洛谷P1901发射站

    题目 一道单调栈裸题,主要是用单调栈维护单调性,和单调队列都可以在\(O(n)\)的时间内得出单调最大值或最小值,要比堆要快. 这个题可以用h来当做单调栈的使用对象,即用单调栈来维护高度,高度是越在栈 ...

  8. 常用spaceclaim脚本（二）

    #创建一个草图 #第一个参数传入一个Frame对象 #通过一个点和两个向量创建Frame #Frame的类成员函数Create被重载 #重载函数1:Frame.Create(Point, Direct ...

  9. 1、ES6声明变量的方式

    1.es5的声明方式var的问题 1)是var在同一个作用域内部,是可以重复声明一个变量的,后面的会把前面的覆盖掉 2)var存在变量提升到的问题,就是在使用var声明变量前是可以先使用此变量的 2. ...

  10. （二）SQL学习之数据定义类SQL

    以mysql为例 对数据库的常用操作 创建数据库:CREATE DATABASE mydb; 删除数据库:DROP DATABASE mydb; 切换数据库:USE mydb; 查询数据库:SHOW ...