2017-01-23 106 views
1

我在我的項目中使用asp.net MVC 5。爲什麼我在_Layout.cshtml的視圖頂部留出空間?

在這裏,在_Layout.cshtml頁面生成的代碼:

<body> 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="container topNavBtn"> 
      <div class="navbar-header "> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
       @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" }) 
      </div> 
      <div class="navbar-collapse collapse"> 
       <ul class="nav navbar-nav"> 
        <li>@Html.ActionLink("Home", "Index", "Home", new { area = "" }, null)</li> 
        <li>@Html.ActionLink("API", "Index", "Help", new { area = "" }, null)</li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div class="container body-content"> 
     @RenderBody() 
     <hr /> 
     <footer> 
      <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p> 
     </footer> 
    </div> 

    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/bootstrap") 
    @RenderSection("scripts", required: false) 
</body> 
</html> 

我從這個div刪除代碼:

<div class="navbar navbar-inverse navbar-fixed-top"> 

創建自己的頭:

<body> 
    <header style="background-color:green">My Header</header> 
    <div class="container body-content"> 
     @RenderBody() 
     <hr /> 
     <footer> 
      <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p> 
     </footer> 
    </div> 

    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/bootstrap") 
    @RenderSection("scripts", required: false) 
</body> 

但在查看我在頁面頂部獲得空間:

enter image description here

任何ide爲什麼我會得到上面的空間?

+0

該標題元素具有內容(「我的標題」),因此它獲得高度 – tmg

+0

您可以檢查您的標題devloper工具並附上截圖 –

回答

0

在Bootstrap中使用固定的導航欄需要在主體上設置填充頂部以爲導航欄提供足夠的空間。頂部的空間是你的導航欄應該去的地方,但你沒有包括它。如果您不需要導航欄,只需從body元素中刪除填充頂部。否則,請添加導航欄以填充空間。

相關問題