ASP.NET Web Pages（WebMatrix / Razor 语法）中的页面布局详解
ASP.NET Web Pages 使用 Razor 语法（.cshtml 文件），最常见的布局方式就是 Layout Page（布局页） + _ViewStart.cshtml，类似 ASP.NET MVC 的布局机制，非常简洁高效。
1. 基本结构（推荐方式）
1. 创建共享布局页
通常放在根目录下的 _Layout.cshtml 或 /Shared/_Layout.cshtml
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<title>@Page.Title - 我的网站</title>
<link href="~/css/site.css" rel="stylesheet" />
@RenderSection("head", required: false)
</head>
<body>
<header>
<h1>欢迎来到我的网站</h1>
<nav>
<a href="/">首页</a> |
<a href="/About.cshtml">关于</a> |
<a href="/Contact.cshtml">联系</a>
</nav>
</header>
<div id="main">
@RenderBody() <!-- 这里插入具体页面的内容 -->
</div>
<footer>
<p>© @DateTime.Now.Year - 我的 ASP.NET Web Pages 网站</p>
</footer>
@RenderSection("scripts", required: false)
</body>
</html>2. 创建 _ViewStart.cshtml（自动应用布局）
放在根目录（或想应用布局的文件夹里）
@{
Layout = "~/Shared/_Layout.cshtml"; // 或者 "~/ _Layout.cshtml"
}有了这个文件，该目录及子目录下的所有 .cshtml 页面都会自动使用指定的布局，无需每次手动写。
3. 普通内容页面示例（如 Index.cshtml）
@{
Page.Title = "首页";
}
@section head {
<style>
h2 { color: #0066cc; }
</style>
}
<h2>欢迎来到首页！</h2>
<p>当前时间：@DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")</p>
<div>
这里是首页的主体内容，会被插入到 @RenderBody() 的位置。
</div>
@section scripts {
<script>
alert("首页加载完成！");
</script>
}2. 其他常用布局技巧
| 功能 | 写法 | 说明 |
|---|---|---|
| 可选区域（Section） | @RenderSection("xxx", required: false) | 内容页可选择是否定义该 section |
| 强制区域 | @RenderSection("xxx", required: true) | 内容页必须定义，否则报错 |
| 判断区域是否存在 | @if (IsSectionDefined("xxx")) { @RenderSection("xxx") } | 条件渲染 |
| 不使用布局（单页） | @{ Layout = null; } | 当前页面不套用任何布局 |
| 动态布局 | @{ Layout = User.IsInRole("Admin") ? "~/AdminLayout.cshtml" : "~/ _Layout.cshtml"; } | 根据条件选择不同布局 |
3. 多层嵌套布局（高级）
可以实现类似 Master Page 的嵌套：
// _AdminLayout.cshtml（继承普通布局）
@{
Layout = "~/Shared/_Layout.cshtml"; // 先套用主布局
}
<div class="admin-panel">
@RenderBody()
</div>
@section scripts {
@RenderSection("adminScripts", required: false)
<script src="~/js/admin.js"></script>
}内容页：
@{
Layout = "~/Shared/_AdminLayout.cshtml";
Page.Title = "管理后台";
}
<h3>后台管理页面</h3>
@RenderBody()4. 旧版方式（不推荐，但仍可使用）
在没有 _ViewStart.cshtml 的早期项目中，每个页面手动指定布局：
@{
Layout = "~/Shared/_Layout.cshtml";
Page.Title = "产品列表";
}5. 常见目录结构示例
/
├── _ViewStart.cshtml
├── Index.cshtml
├── About.cshtml
├── Contact.cshtml
├── Shared/
│ └── _Layout.cshtml
├── Admin/
│ ├── _ViewStart.cshtml （可单独指定不同布局）
│ └── Dashboard.cshtml
└── css/
└── site.css总结一句话：
最简洁高效的做法就是：创建一个
_Layout.cshtml作为母版页，在根目录放一个_ViewStart.cshtml指定Layout，以后所有页面自动套用布局，只需要写内容和@section即可。
这样就能实现和 ASP.NET MVC 几乎一样的优雅页面布局了。需要我提供一个完整可运行的示例项目结构吗？
