Asp.Net中的Bootstrap儀表板示例

-1

我在實現asp頁面中的引導時遇到了一些問題。我如何將我的asp主頁的ContentPlaceHolder放到我的Navbar的右側？Asp.Net中的Bootstrap儀表板示例

母版頁：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Main.master.cs" Inherits="WebApplication1.Main" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="Content/bootstrap.css" rel="stylesheet" type="text/css" /> 
    <link href="Content/bootstrap-theme.css" rel="stylesheet" type="text/css" /> 
    <asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 

    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
     <div class="container-fluid"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" 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="http://getbootstrap.com/examples/dashboard/#">Project name</a> 
      </div> 
      <div class="navbar-collapse collapse"> 
       <ul class="nav navbar-nav navbar-right"> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Dashboard</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Settings</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Profile</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Help</a></li> 
       </ul> 
       <form class="navbar-form navbar-right"> 
        <input type="text" class="form-control" placeholder="Search..."> 
       </form> 
      </div> 
     </div> 
    </div> 

    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-sm-3 col-md-2 sidebar"> 
       <ul class="nav nav-sidebar"> 
        <li class="active"><a href="http://getbootstrap.com/examples/dashboard/#">Overview</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Reports</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Analytics</a></li> 
        <li><a href="http://getbootstrap.com/examples/dashboard/#">Export</a></li> 
       </ul> 
       <ul class="nav nav-sidebar"> 
        <li><a href="">Nav item</a></li> 
        <li><a href="">Nav item again</a></li> 
        <li><a href="">One more nav</a></li> 
        <li><a href="">Another nav item</a></li> 
        <li><a href="">More navigation</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 

    <div class="Container"> 
     <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> 
     </asp:ContentPlaceHolder> 
    </div> 

    <script src="Scripts/jquery.min.js"></script> 
    <script src="Scripts/bootstrap.min.js"></script> 

</body> 
</html>

這使導航欄下的內容，將會至極看起來像這樣： enter image description here

我需要知道在哪裏實施的ContentPlaceHolder。

來源

2014-05-23 The Donger

<div class="Container">到上述<div class="container-fluid">

也刪除，如果需要你從ContentPlaceHolder1的col-sm-offset-X裹。

這裏是一個工作DEMO

來源

2014-05-23 09:55:16 equisde

這讓我的側邊欄上的我的內容的右側，而不是在它所屬的左邊？ –

Asp.Net中的Bootstrap儀表板示例

回答

相關問題