ASP.NET Web Pages - 页面布局

最新推荐文章于 2025-05-31 10:27:11 发布

晚夜微雨问海棠呀

最新推荐文章于 2025-05-31 10:27:11 发布

阅读量344

点赞数 2

CC 4.0 BY-SA版权

文章标签：前端

本文链接：https://blog.youkuaiyun.com/weixin_45422672/article/details/145468121

在 ASP.NET Web Pages 中，页面布局可以通过使用 _Layout.cshtml 文件来实现。这个文件通常位于 ~/Shared 目录下，用于定义整个网站的通用布局。以下是一个简单的示例，展示如何创建和使用布局文件。

1. 创建布局文件

首先，在 ~/Shared 目录下创建一个名为 _Layout.cshtml 的文件。这个文件将包含网站的通用布局，例如头部、导航栏和底部。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>@Page.Title - 我的网站</title>
    <link href="~/Styles/site.css" rel="stylesheet" />
</head>
<body>
    <header>
        <h1>我的网站</h1>
        <nav>
            <ul>
                <li><a href="/">首页</a></li>
                <li><a href="/About">关于我们</a></li>
                <li><a href="/Contact">联系我们</a></li>
            </ul>
        </nav>
    </header>

    <main>
        @RenderBody()
    </main>

    <footer>
        <p>&copy; @DateTime.Now.Year - 我的网站</p>
    </footer>
</body>
</html>

2. 在页面中使用布局

接下来，在你的页面中指定使用这个布局文件。例如，创建一个 Index.cshtml 文件，并在其中设置 Layout 属性。

@{
    Layout = "~/_Layout.cshtml";
    Page.Title = "首页";
}

<h2>欢迎来到我的网站</h2>
<p>这是一个示例首页。</p>

3. 运行页面

当你运行 Index.cshtml 页面时，它会使用 _Layout.cshtml 文件中的布局。页面的内容将插入到布局文件中的 @RenderBody() 位置。

说明

@Page.Title：设置页面的标题。
@RenderBody()：这是页面内容将被插入的位置。
@Layout：指定要使用的布局文件。