use*_*990 3 asp.net master-pages twitter-bootstrap
我的asp.net 的母版页。我已经添加了为我的菜单创建子菜单下拉菜单所需的内容。不知何故它不起作用。
<%@ Import Namespace="System.Web.Optimization" %>
<!DOCTYPE html>
<html lang="en">
<head id="Head1" runat="server">
<title>Navbar Template for Bootstrap</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Sample page to include Bootstrap and Web API to Asp.Net forms application.">
<meta name="author" content="Sree">
<link href="Content/bootstrap-theme.css" rel="stylesheet" />
<link href="Content/bootstrap-theme.min.css" rel="stylesheet" />
<link href="Content/bootstrap.css" rel="stylesheet" />
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<script src="Scripts/bootstrap.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/jquery-2.1.1.intellisense.js"></script>
<script src="Scripts/jquery-2.1.1.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<asp:ContentPlaceHolder ID="StyleSection" runat="server" />
<script>
$(document).ready(function () {
$('.dropdown-toggle').dropdown();
});
</script>
</head>
<body>
<%--<form id="form1" runat="server">--%>
<div class="container">
<!-- Static navbar -->
<div class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
<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="#">Project name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="ContentPage.aspx">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-submenu">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="./">Default</a></li>
<li><a href="../navbar-static-top/">Static top</a></li>
<li><a href="../navbar-fixed-top/">Fixed top</a></li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container-fluid -->
</div>
<!-- Content Page Section -->
<div class="container">
<asp:ContentPlaceHolder ID="ContentSection" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
<!-- /container -->
<%-- Script Section --%>
<%: Scripts.Render("~/bundles/jQuery") %>
<asp:ContentPlaceHolder ID="ScriptSection" runat="server" />
<%--</form>--%>
</body>
</html>
以下是我的子页面。当我引用所有 css 和 jquery 并将它们从母版页中排除时，它可以工作。如果我删除网络引用，则它不起作用。请帮助 - 我如何使用本地参考来做到这一点？
<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="ContentPage.aspx.cs" Inherits="Sample.ContentPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="StyleSection" runat="server">
<link href="Content/bootstrap-theme.css" rel="stylesheet" />
<link href="Content/bootstrap-theme.min.css" rel="stylesheet" />
<link href="Content/bootstrap.css" rel="stylesheet" />
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<script src="Scripts/bootstrap.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/jquery-2.1.1.intellisense.js"></script>
<script src="Scripts/jquery-2.1.1.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentSection" runat="server">
<!-- Main component for a primary marketing message or call to action -->
<div class="jumbotron">
<h1>Navbar example</h1>
<p>
This example is a quick exercise to illustrate how the default, static navbar and
fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts
to your viewport and device.
</p>
<p>
<a class="btn btn-lg btn-primary" href="#" role="button">View navbar docs »</a>
</p>
</div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ScriptSection" runat="server">
</asp:Content>
您需要在bootstrap.js之前添加jQuery。
<script src="Scripts/jquery-2.1.1.js"></script>
<script src="Scripts/bootstrap.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
仅供参考：不要将jquery-2.1.1.intellisense.js添加到母版页；相反，使用_references.js
| 归档时间： |
|
| 查看次数： |
10270 次 |
| 最近记录： |