ASP.NET 网页 - 页面布局


使用网页可以轻松创建具有一致布局的网站。


一致的外观

在互联网上,您会发现许多具有一致外观和风格的网站:

  • 每个页面都有相同的标题
  • 每个页面都有相同的页脚
  • 每个页面都有相同的样式和布局

通过网页,这可以非常有效地完成。您可以在单独的文件中包含可重用的内容块(内容块),例如页眉和页脚。

您还可以使用布局模板(布局文件)为所有页面定义一致的布局。


内容块

许多网站的每个页面上都显示内容(例如页眉和页脚)。

通过网页,您可以使用@RenderPage()从单独文件导入内容的方法。

内容块(来自另一个文件)可以导入网页中的任何位置,并且可以包含文本、标记和代码,就像任何常规网页一样。

以常见的页眉和页脚为例,这可以为您节省大量工作。您不必在每个页面中编写相同的内容,并且当您更改页眉或页脚文件时,所有页面中的内容都会更新。

这是它在代码中的样子:

示例

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1>
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html>
运行示例 »


使用布局页面

在上一节中,您看到在许多网页中包含相同的内容很容易。

创建一致外观的另一种方法是使用布局页面。布局页面包含网页的结构,但不包含网页的内容。当网页(内容页)链接到布局页时,将根据布局页(模板)进行显示。

布局页面就像一个普通的网页,除了调用@RenderBody()将包含内容页面的方法。

每个内容页必须以布局指令

这是它在代码中的样子:

布局页面:

<html>
<body>
<p>This is header text</p>
@RenderBody()
<p>&copy; 2014 91xjr. All rights reserved.</p>
</body>
</html>

任何网页:

@{Layout="Layout.cshtml";}

<h1>Welcome to 91xjr</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laborisnisi ut aliquip ex ea commodo consequat.
</p>
运行示例 »

DRY——不要重复自己

使用内容块和布局页面这两个 ASP.NET 工具,您可以为您的 Web 应用程序提供一致的外观。

这些工具还可以为您节省大量工作,因为您不必在所有页面上重复相同的信息。集中标记、样式和代码使 Web 应用程序更易于管理和维护。


防止文件被浏览

对于 ASP.NET,无法从 Web 浏览名称以下划线开头的文件。

如果您想防止用户查看您的内容块或布局文件,请将文件重命名为:

_header.cshtml

_footer.cshtml

_布局.cshtml


隐藏敏感信息

对于 ASP.NET,隐藏敏感信息(数据库密码、电子邮件密码等)的常见方法是将这些信息保存在名为 "_AppStart" 的单独文件中。

_AppStart.cshtml

@{
WebMail.SmtpServer = "mailserver.example.com";
WebMail.EnableSsl = true;
WebMail.UserName = "username@example.com";
WebMail.Password = "your-password";
WebMail.From = "your-name-here@example.com";
}