ASP.NET Web Pages 教程 —— Razor 语法全面指南

在本教程中，我们将学习如何在 ASP.NET Web Pages 中使用 Razor 语法，并通过示例掌握 C# 和 Visual Basic 的基本用法。Razor 能让你在网页中嵌入服务器端代码，实现动态内容生成。

---

什么是 Razor？

Razor 是一种简洁的 服务器端标记语法，用于将 C# 或 VB 代码嵌入 HTML 页面。它的特点包括：

• 轻量、易学，比传统 ASP.NET Web Forms 简洁
• 支持 C# 和 Visual Basic
• 可在服务器端执行代码并返回结果
• 文件扩展名：.cshtml（C#）、.vbhtml（VB）
• 内联表达式以 @ 开头，可在 HTML 中直接显示变量或函数结果

Razor 语法的设计理念是 代码少、易读、易维护，非常适合 Web 开发新手和 ASP.NET 开发者。

---

添加 Razor 代码示例

假设我们有一个最基础的 HTML 页面：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Web Pages Demo</title>
</head>
<body>
<h1>Hello Web Pages</h1>
</body>
</html>

我们可以使用 Razor 显示服务器时间：

<p>The time is @DateTime.Now</p>

完整页面示例：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Web Pages Demo</title>
</head>
<body>
<h1>Hello Web Pages</h1>
<p>The time is @DateTime.Now</p>
</body>
</html>

@DateTime.Now 是 Razor 的内联表达式，会在服务器端执行并返回当前时间。

---

Razor C# 基本语法

特性	说明
代码块	@{ ... } 包含多条语句
内联表达式	以 @ 开头，例如 @myVariable
语句结束	使用分号 ;
变量声明	使用 var
字符串	双引号 "..."
文件扩展名	.cshtml
区分大小写	是

示例：

@{ var myMessage = "Hello World"; }

<p>The value of myMessage is: @myMessage</p>

@{
    var greeting = "Welcome to our site!";
    var weekDay = DateTime.Now.DayOfWeek;
    var greetingMessage = greeting + " Today is: " + weekDay;
}
<p>The greeting is: @greetingMessage</p>

---

Razor Visual Basic 基本语法

特性	说明
代码块	@Code ... End Code
内联表达式	以 @ 开头，例如 @myVariable
变量声明	使用 Dim
字符串	双引号 "..."
文件扩展名	.vbhtml
区分大小写	不区分

示例：

@Code
dim myMessage = "Hello World"
End Code

<p>The value of myMessage is: @myMessage</p>

@Code
dim greeting = "Welcome to our site!"
dim weekDay = DateTime.Now.DayOfWeek
dim greetingMessage = greeting & " Today is: " & weekDay
End Code

<p>The greeting is: @greetingMessage</p>

---

Razor 页面示例

1. 主页（C#）

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

2. 隐私政策页

@page
@model PrivacyModel
@{
    ViewData["Title"] = "Privacy Policy";
}
<h1>@ViewData["Title"]</h1>
<p>Use this page to detail your site's privacy policy.</p>

3. 错误页面

@page
@model ErrorModel
@{
    ViewData["Title"] = "Error";
}

<h1 class="text-danger">Error.</h1>
<h2 class="text-danger">An error occurred while processing your request.</h2>

@if (Model.ShowRequestId)
{
    <p>
        <strong>Request ID:</strong> <code>@Model.RequestId</code>
    </p>
}

<h3>Development Mode</h3>
<p>
    Enabling the <strong>Development</strong> environment displays detailed error information.
</p>
<p>
    <strong>Do not enable Development mode in production</strong> --- it may expose sensitive information.
</p>

4. 命名空间与 TagHelper

@using WebApplication1
@namespace WebApplication1.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

---

小结

通过本教程，你已经掌握了：

1. Razor 的核心概念和语法
2. C# 与 VB 的 Razor 代码写法
3. ASP.NET Web Pages 页面创建与动态内容显示
4. 页面模板、命名空间和 TagHelper 的基本使用

Razor 的简洁语法让 ASP.NET Web Pages 更易于学习和维护。如果想深入学习，可以参考官方文档：ASP.NET Core Web Apps。

---

✅ 优化亮点：

• 逻辑顺序更清晰：从概念 → 示例 → 语法 → 页面应用 → 总结
• 表格整理语法规则，阅读更直观
• 语言更自然、精炼，更适合 CSDN 发布
• 保留完整代码示例，适合初学者跟着实操