我正在使用mvc-5并使用bootstrap，我的所有链接都在_Layout.cshtml现在我有一个下拉标签，如http://prntscr.com/75qqpp（使用bootstrap）现在在我的
_Layout.cshtml我有renderbody()呈现我的所有用户界面。
我想要什么？ 单击“实时”选项卡后，我会看到一个下拉列表，在进一步点击“Tabular”必须打开时，将选项卡正下方的当前视图替换为新视图。
我是如何尝试这样做的？
（1）在家庭控制器中，我这样做：
public ActionResult tabular()
{
return View();
}
（2）然后我创建视图并在该视图中添加如下布局路径：
@{
ViewBag.Title = "tabular";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>tabular</h2>
因此，我拥有所有标签，但它们未正确分配，现在显示如下视图：http://prntscr.com/75qxaz 我觉得我在这里没有使用bootstrap或者我做错了什么？
有人可以提供指导，以便我可以在第一个链接的选项卡下面有tabular.cshtml视图（此选项卡对于获得的所有视图都是通用的）
我的完整代码是：
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<!--starts here-->
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="bootstrap/js/jquery-ui.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script> <!--click on main tab disappers-->
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" />
<link href="bootstrap/css/jquery.easy-pie-chart.css" rel="stylesheet" media="screen" />
<link href="bootstrap/css/styles.css" rel="stylesheet" />
<link href="/bootstrap/css/DT_bootstrap.css" rel="stylesheet" media="screen">
<link href="bootstrap/css/jquery.jgrowl.css" rel="stylesheet" />
<link href="bootstrap/css/cssFiles.css" rel="stylesheet" />
<!-- Bootstrap -->
<link href="bootstrap/css/chosen.min.css" rel="stylesheet" />
<link href="bootstrap/css/DT_bootstrap.css" rel="stylesheet" />
<link href="/static/vendors/jGrowl/jquery.jgrowl.css" rel="stylesheet" media="screen">
<link href="bootstrap/css/styles.css" rel="stylesheet" />
<link href="bootstrap/css/datepicker.css" rel="stylesheet" />
<link href="bootstrap/css/uniform.default.css" rel="stylesheet" />
<link href="bootstrap/css/dataTables.tableTools.css" rel="stylesheet" />
<link href="bootstrap/css/bootstrap-wysihtml5.css" rel="stylesheet" />
<link href="bootstrap/css/datepicker.css" rel="stylesheet" />
<link href="bootstrap/css/uniform.default.css" rel="stylesheet" />
<link href="bootstrap/css/chosen.min.css" rel="stylesheet" />
<link href="bootstrap/css/bootstrap-wysihtml5.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="bootstrap/css/dataTables.tableTools.css" />
<!-- <script src="bootstrap/js/bootstrap.min.js"></script> <!--click on main tab disappers-->
<!-- <script src="bootstrap/js/common.js"></script> hover disappears-->
<script src="bootstrap/js/jquery.dataTables.min.js"></script>
<script src="bootstrap/js/jquery.easy-pie-chart.js"></script>
<script src="bootstrap/js/jquery.jgrowl.js"></script>
<script src="bootstrap/js/scripts.js"></script>
<script src="bootstrap/js/DT_bootstrap.js"></script>
<script src="bootstrap/js/jquery-DT-pagination.js"></script>
<script type="text/javascript" src="bootstrap/js/icon-selector.js"></script>
<script src="bootstrap/js/dashboard.js"></script>
<script type="text/javascript" src="bootstrap/js/moment.min.js"></script>
<script type="text/javascript" src="bootstrap/js/moment-timezone-with-data-2010-2020.min.js"></script>
<script src="bootstrap/js/jquery.bootstrap.wizard.min.js"></script>
<script src="bootstrap/js/raphael-min.js"></script>
<script src="bootstrap/js/morris.min.js"></script>
<!--ends here-->
</head>
<body>
<div>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<div class="navbar navbar-custom navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/dashboard/">Vision Vertex</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">
Real Time
<i class="caret"></i>
</a>
<ul class="dropdown-menu">
<li>
<a tabindex="-1" href="~/Views/Shared/_Layout/">Dashboard</a>
</li>
<li>
<!--onclick="tabularFunction()" -->
@*<a tabindex="-1" href="~/Views/Home/BackgroundViews/tabular.cshtml">Tabular</a>*@
@Html.ActionLink("Tabular", "tabular", "Home")
</li>
<li>
<a tabindex="-1" href="/dashboard/map/">Live Map</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">
Utilites<i class="caret"></i>
</a>
<ul class="dropdown-menu">
<li>
<a tabindex="-1" href="/dashboard/contact-list/">List Contacts</a>
</li>
<li>
<a tabindex="-1" href="/dashboard/contact-registration/">Add Contact</a>
</li>
<li class="divider"></li>
<li>
<a tabindex="-1" href="/dashboard/notification-list/">List Notification</a>
</li>
<li>
<a tabindex="-1" href="/dashboard/notification-registration/">Add Notification</a>
</li>
<li class="divider"></li>
<li>
<a tabindex="-1" href="/dashboard/report-list/">List Periodic Report</a>
</li>
<li>
<a tabindex="-1" href="/dashboard/report-registration/">Add Periodic Report</a>
</li>
<li class="divider"></li>
<li>
<a tabindex="-1" href="/dashboard/list-period-alert/">List Periodic Alert</a>
</li>
<li>
<a tabindex="-1" href="/dashboard/add-period-alert/">Add Periodic Alert</a>
</li>
<!--li class="divider"></li>
<li>
<a tabindex="-1" href="#">FAQ</a>
</li-->
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr/>
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
</body>
</html>
HomeController：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace testLayt.Controllers
{
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
return View();
}
public ActionResult tabular()
{
return View();
}
}
}
tabular.cshtml：
@{
ViewBag.Title = "tabular";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>tabular</h2>