将 .net 项目转换为使用布局后页面顶部的空白答案

【问题标题】：White space at top of page after converting .net project to use layouts将 .net 项目转换为使用布局后页面顶部的空白
【发布时间】：2017-08-21 20:44:04
【问题描述】：

我最近更改了我的 .net 项目以使用母版页/布局页。现在，当我的所有页面都呈现出来时，在导航栏之前的页面顶部有一些空间。

我在 chrome 中检查了该页面，正文顶部有一些空引号，删除检查器中的那些可以解决问题。但我无法理解它们来自哪里？这是我的索引的页面结构。

@{
  Layout = "~/Views/Shared/_Layout.cshtml";
  ViewBag.Title = "my title";
}
<!--HERO IMAGE-->
<div>
    //index page's code comes here
</div>

@section additionalStyles{
   //adding external stylesheets
}

我在我的索引页面中使用渲染部分来加载一些在其余页面中没有用的样式表。这些在布局页面中的结束标记之前加载，如下所示：

<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>@ViewBag.Title</title>

  <!-- All STYLESHEETS ARE ADDED AT THIS PLACE-->

  @RenderSection("additionalStyles", required: false);
</head>
<body>
  <div class="navbar">
       //navbar's code  comes here
  </div>

    @RenderBody();

  <!-- FOOTER -->

  @RenderSection("additionalScripts", required: false);

  <!-- ALL SCRIPTS ARE ADDED HERE-->
</body>
</html>

可能是什么导致了这些引号？

Ps：我刚刚注意到我的许多页面都有间距和引号，因此它们可能来自布局文件，或者可能是这些部分导致了问题，但我不知道如何解决它强>

编辑：第二个页面实际上定义了布局页面要呈现的两个部分，实际上是获得了其中的三个“”“引号”“”。

在第一个 renderSection(additionalStyles) 的末尾
renderBody() 放置的内容末尾的一个
一个在renderSection(additionalScripts)放置的内容的末尾

这是某种模式吗？

【问题讨论】：

请提供更多代码。
我也添加了布局页面的结构。
也许可以添加 Chrome 检查器的屏幕截图，以便我们可以看到插入引号的位置。
我其实加了个截图，可能误删了，我重新加一下吧。
@sleeyuen 添加。

标签： asp.net asp.net-mvc asp.net-mvc-4 asp.net-mvc-3 razor

【解决方案1】：

如果您仔细观察，它会插入分号;。

@RenderSection("additionalStyles", required: false);

@RenderBody();

您的代码在@RenderSections 之后有不必要的分号，并且正在生成它们以供显示。删除它们，“空间”就会消失。

有关分号的用法，请参阅https://docs.microsoft.com/en-us/aspnet/web-pages/overview/getting-started/introducing-razor-syntax-c 的第 3 节。

在块中，每个代码语句都以分号结束

在代码块内，每条完整的代码语句都必须以分号结尾。内联表达式不以分号结尾。

<!-- Single-statement block -->
@{ var theMonth = DateTime.Now.Month; }

<!-- Multi-statement block -->
@{
    var outsideTemp = 79;
    var weatherMessage = "Hello, it is " + outsideTemp + " degrees.";
}

<!-- Inline expression, so no semicolon -->
<p>Today's weather: @weatherMessage</p>

【讨论】：

【解决方案2】：

我认为问题在于@RenderSections 和@RenderBody 末尾的分号。那些不参加半决赛：

@RenderSection("additionalStyles", required: false)
@RenderBody()

【讨论】：

【解决方案3】：

您的布局中似乎有一个杂散的分号 (;)。我会检查布局页面是否有任何杂散或重复的分号（例如，它们可能被错误地重复;;）。还要检查 _ViewStart.cshtml 文件。

【讨论】：