ASP.NET 网页简介 - 编程基础知识

项目
07/13/2023

本教程概述了如何使用 Razor 语法在 ASP.NET 网页中编程。

学习内容：

用于在 ASP.NET 网页中编程的基本“Razor”语法。

一些基本 C#，即你将使用的编程语言。

网页的一些基本编程概念。

如何安装包 (包含预生成代码的组件，) 用于站点。

如何使用 帮助程序 执行常见编程任务。

已讨论的功能/技术：

NuGet 和包管理器。

帮助 Gravatar 程序。

本教程主要介绍将用于 ASP.NET 网页的编程语法。你将了解使用 C# 编程语言编写的 Razor 语法 和代码。在上一教程中，你了解了此语法;在本教程中，我们将进一步介绍语法。

我们承诺本教程涉及在单个教程中看到的编程最多，并且它是唯一只关于编程的教程。在此集中的其余教程中，你将实际创建执行有趣操作的页面。

你还将了解 帮助程序。帮助程序是可以添加到页面的组件（打包的代码片段）。帮助程序会为你执行手动操作可能繁琐或复杂的工作。

创建页面以使用 Razor 播放

在本部分中，你将使用 Razor 进行一些操作，以便了解基本语法。

启动 WebMatrix（如果尚未运行）。你将使用在上一教程中创建的网站 (入门网页) 。若要重新打开它，请单击“ 我的网站” ，然后选择 “WebPageMovies”：

Web 矩阵开始屏幕的屏幕截图，其中显示了“打开网站”选项和“我的网站”，其中突出显示了红色矩形。

选择“ 文件” 工作区。

在功能区中，单击“ 新建 ”以创建页面。选择“ CSHTML ”，并将新页命名为 TestRazor.cshtml。

单击 “确定” 。

将以下内容复制到文件中，完全替换已有的内容。

注意

将示例中的代码或标记复制到页面中时，缩进和对齐方式可能与教程中不同。不过，缩进和对齐不会影响代码的运行方式。

@{
   // Working with numbers
   var a = 4;
   var b = 5;
   var theSum = a + b;

   // Working with characters (strings)
   var technology = "ASP.NET";
   var product ="Web Pages";

   // Working with objects
   var rightNow = DateTime.Now;
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Testing Razor Syntax</title>
    <meta charset="utf-8" />
    <style>
    body {font-family:Verdana; margin-left:50px; margin-top:50px;}
    div {border: 1px solid black; width:50%; margin:1.2em;padding:1em;}
    span.bright {color:red;}
    </style>
  </head>
<body>
  <h1>Testing Razor Syntax</h1>
  <form method="post">

    <div>
      <p>The value of <em>a</em> is @a.  The value of <em>b</em> is @b.
      <p>The sum of <em>a</em> and <em>b</em> is <strong>@theSum</strong>.</p>
      <p>The product of <em>a</em> and <em>b</em> is <strong>@(a*b)</strong>.</p>
    </div>

    <div>
      <p>The technology is @technology, and the product is @product.</p>
      <p>Together they are <span class="bright">@(technology + " " + product)</span></p>
   </div>

   <div>
     <p>The current date and time is: @rightNow</p>
     <p>The URL of the current page is<br/><br/><code>@Request.Url</code></p>
   </div>

  </form>
</body>
</html>

检查示例页

你看到的大多数内容都是普通 HTML。但是，顶部有以下代码块：

@{
   // Working with numbers.
   var a = 4;
   var b = 5;
   var theSum = a + b;

   // Working with characters (strings).
   var technology = "ASP.NET";
   var product ="Web Pages";

   // Working with objects.
   var rightNow = DateTime.Now;
}

请注意此代码块的以下事项：

@ 字符告诉 ASP.NET 后面的是 Razor 代码，而不是 HTML。 ASP.NET 会将 @ 字符后的所有内容视为代码，直到它再次运行到某些 HTML 中。 (在本例中，这就是 <！DOCTYPE> 元素。
如果代码 ( 具有多行，则大括号 { 和 } ) 包含 Razor 代码块。大括号告知 ASP.NET 该块的代码开始和结束的位置。
// 字符将标记注释，即不会执行的代码的一部分。
每个语句必须以分号 (;) 结尾。 (非注释，不过.)
可以将值存储在变量中， (使用关键字 (keyword) var 声明) 变量。创建变量时，需要为其指定一个名称，该名称可以包含字母、数字和下划线 (_) 。变量名称不能以数字开头，也不能像 var) 一样使用编程关键字 (keyword) (的名称。
将字符串 (（如“ASP.NET”和“Web Pages”）) 括在引号中。 (它们必须是双引号。) 数字不在引号中。
引号外的空格并不重要。换行通常并不重要;例外情况是无法跨行用引号拆分字符串。缩进和对齐并不重要。

从此示例中看不出，所有代码都区分大小写。这意味着变量 TheSum 与可能命名为 theSum 或 thesum 的变量不同。同样，var 是关键字 (keyword) ，但 Var 不是。

对象、属性和方法

然后是表达式 DateTime.Now。简单来说，DateTime 是一个对象。对象是一个可以编程的东西 - 页面、文本框、文件、图像、Web 请求、电子邮件、客户记录等。对象具有一个或多个描述其特征 的属性 。文本框对象具有 Text 属性 (等) ，请求对象具有 url 属性 (，其他属性) ，电子邮件具有 From 属性和 To 属性，等等。对象还有一 些方法是 它们可以执行的“谓词”。你将经常使用对象。

如示例中所示，DateTime 是一个对象，可用于对日期和时间进行编程。它具有一个名为 Now 的属性，该属性返回当前日期和时间。

使用代码在页面中呈现标记

在页面正文中，请注意以下事项：

<div>
  <p>The value of <em>a</em> is @a.  The value of <em>b</em> is @b.
  <p>The sum of <em>a</em> and <em>b</em> is <strong>@theSum</strong>.</p>
  <p>The product of <em>a</em> and <em>b</em> is <strong>@(a*b)</strong>.</p>
</div>

<div>
  <p>The technology is @technology, and the product is @product.</p>
  <p>Together they are <span class="bright">@(technology + " " + product)</span></p>
</div>

<div>
  <p>The current date and time is: @rightNow</p>
     <p>The URL of the current page is<br/><br/><code>@Request.Url</code></p>
</div>

同样，@ 字符告诉 ASP.NET 后面的是代码，而不是 HTML。在标记中，可以添加 @ 后跟代码表达式，ASP.NET 将立即呈现该表达式的值。在此示例中， @a 将呈现名为的 @product 变量的值，呈现名为 product 的变量中的任何值，等等。

不过，你并不局限于变量。在此实例中，@ 字符位于表达式前面：

@ (a*b) 呈现变量 a 和 b 中任何值的乘积。 (* 运算符表示 multiplication.)
@ (技术 + “” + product) 在连接变量技术和产品并在两者之间添加空格后，呈现变量技术和产品中的值。用于串联字符串的运算符 (+) 与用于添加数字的运算符相同。 ASP.NET 通常可以判断是使用数字还是字符串，并使用 + 运算符执行正确的操作。
@Request.Url 呈现 Request 对象的 Url 属性。 Request 对象包含有关来自浏览器的当前请求的信息，当然 Url 属性包含当前请求的 URL。

该示例还旨在向你展示你可以以不同的方式执行工作。可以在顶部的代码块中执行计算，将结果放入变量中，然后在标记中呈现变量。或者，可以直接在标记中的表达式中执行计算。使用的方法取决于你正在执行的操作，在某种程度上取决于你自己的偏好。

查看运行中的代码

右键单击文件的名称，然后选择“ 在浏览器中启动”。可以在浏览器中看到页面，其中包含该页中解析的所有值和表达式。

浏览器窗口中运行的“测试 Razor”页的屏幕截图，其中显示了已解析的值和表达式的三个框。

在浏览器中查看源。

测试 Razor 页面源的屏幕截图，将页面源与呈现的 Web 浏览器输出进行比较。

正如你在上一教程中的经验所期望的那样，页面中没有 Razor 代码。你看到的就是实际显示值。运行页面时，实际上是向 WebMatrix 中内置的 Web 服务器发出请求。收到请求后，ASP.NET 解析所有值和表达式，并将其值呈现到页面中。然后，它会将页面发送到浏览器。

提示

Razor 和 C#

到目前为止，我们已经说过你使用的是 Razor 语法。这是真的，但它不是完整的故事。你使用的实际编程语言称为 C#。 C# 由 Microsoft 在十多年前创建，已成为用于创建 Windows 应用的主要编程语言之一。你所看到的有关如何命名变量以及如何创建语句等的所有规则实际上都是 C# 语言的所有规则。

Razor 更具体地引用了关于如何将此代码嵌入页面的一小部分约定。例如，使用 @ 标记页面中的代码和使用 @{ } 嵌入代码块的约定是页面的 Razor 方面。帮助程序也被视为 Razor 的一部分。使用 Razor 语法的位置远不止 ASP.NET 网页。 (例如，它也用于 ASP.NET MVC 视图。)

我们提及，因为如果你查找有关编程 ASP.NET 网页的信息，你会发现很多对 Razor 的引用。但是，许多这些引用不适用于你正在执行的操作，因此可能会造成混淆。事实上，你的许多编程问题实际上都与使用 C# 或 ASP.NET 有关。因此，如果专门查找有关 Razor 的信息，可能无法找到所需的答案。

添加一些条件逻辑

在页面中使用代码的一个出色功能是，可以根据各种条件更改所发生的情况。在本教程的这一部分中，你将通过一些方法来更改页面中显示的内容。

该示例简单且经过一些尝试，以便我们可以专注于条件逻辑。你将创建的页面将执行以下操作：

在页面上显示不同的文本，具体取决于这是第一次显示页面，还是你单击了提交页面的按钮。这是第一个条件测试。
仅当 URL 的查询字符串中传递了特定值时，才显示消息 (http://...？show=true) 。这是第二个条件测试。

在 WebMatrix 中，创建一个页面并将其命名为 TestRazorPart2.cshtml。 (在功能区中，单击“ 新建”，选择 “CSHTML”，为文件命名，然后单击“ 确定”。)

将该页的内容替换为以下内容：

@{
   var message = "This is the first time you've requested the page.";
}
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Testing Razor Syntax - Part 2</title>
    <meta charset="utf-8" />
    <style>
      body {font-family:Verdana; margin-left:50px; margin-top:50px;}
      div {border: 1px solid black; width:50%; margin:1.2em;padding:1em;}
    </style>
  </head>
  <body>
  <h1>Testing Razor Syntax - Part 2</h1>
  <form method="post">
    <div>
      <p>@message</p>
      <p><input type="submit" value="Submit" /></p>
  </div>
  </form>
</body>
</html>

顶部的代码块使用一些文本初始化名为 message 的变量。在页面正文中，消息变量的内容显示在 p> 元素内<。标记还包含用于<创建“提交”按钮的输入>元素。

运行页面以查看它现在的工作原理。目前，它基本上是一个静态页面，即使单击“ 提交 ”按钮也是如此。

返回 WebMatrix。在代码块内，在初始化消息的行后面添加以下突出显示的代码：

@{
    var message = "This is the first time you've requested the page.";

    if(IsPost) {
        message = "Now you've submitted the page.";
    }
}

if { } 块

刚刚添加的是 if 条件。在代码中， if 条件具有如下所示的结构：

if(some condition){
    One or more statements here that run if the condition is true;
}

要测试的条件在括号中。它必须是返回 true 或 false 的值或表达式。如果条件为 true，ASP.NET 运行大括号内的语句。 (这些是 if-then logic.) 如果条件为 false，则跳过代码块。

下面是可在 if 语句中测试的几个条件示例：

if(currentValue > 12) { ... }

if(dueDate <= DateTime.Today) { ... }

if(IsDone == true) { ... }

if(IsPost) { ... }

if(!IsPost) { ... }

if(a != 0) { ... }

if(fileProcessingIsDone != true && displayMessage == false) { ... }

可以使用 逻辑运算符 或 比较运算符针对值或表达式测试变量：等于 (==) 、大于 (>) 、小于 (<) 、大于或等于 (>=) ，以及小于或等于 (<=) 。！= 运算符表示不等于，例如，如果 (！= 0) 表示 如果不等于 0。

注意

请确保注意到等于 (==) 的比较运算符与 =不同。 = 运算符仅用于将值赋值 (var a=2) 。如果混合这些运算符，你要么收到错误，要么得到一些奇怪的结果。

若要测试某些内容是否为 true，完整的语法为 if (IsDone == true) 。但如果 (IsDone) ，也可以使用快捷方式。如果没有比较运算符，ASP.NET 假设要测试 true。

此 ! 运算符本身表示逻辑 NOT。例如，如果 (！IsPost) 表示 IsPost 不为 true。

可以使用逻辑 AND (&& 运算符) 或逻辑 OR (|| 组合条件运算符) 。例如，上述示例中的最后一个 if 条件表示 FileProcessingIsDone 未设置为 true，并且 displayMessage 设置为 false。

else 块

关于 if 块的最后一点：if 块可以后跟 else 块。当条件为 false 时，必须执行不同的代码，则 else 块很有用。下面是一个简单示例：

var message = "";
if(errorOccurred == true)
{
    message = "Sorry, an error occurred."; 
}
else
{
    message = "The process finished without errors!";
}

你将在本系列后面的教程中看到一些示例，其中使用 else 块很有用。

测试请求是否为提交 (发布)

还有更多内容，但让我们回到示例，如果 (IsPost) { ... }，该示例具有条件。 IsPost 实际上是当前页的属性。首次请求页面时，IsPost 返回 false。但是，如果单击某个按钮或以其他方式提交页面（即发布该页面），IsPost 将返回 true。因此，IsPost 允许您确定是否正在处理表单提交。 (就 HTTP 谓词而言，如果请求是 GET 操作，则 IsPost 返回 false。如果请求是 POST 操作，则 IsPost 返回 true.) 在后面的教程中，你将使用输入表单，其中此测试变得特别有用。

运行页面。由于这是你第一次请求页面，你会看到“这是你第一次请求页面”。该字符串是将消息变量初始化到的值。有一个 if (IsPost) 测试，但此时返回 false，因此 if 块中的代码不会运行。

单击“ 提交 ”按钮。再次请求页面。与之前一样，消息变量设置为“这是第一次...”。但这次，如果 (IsPost) 测试返回 true，则 if 块内的代码将运行。代码将消息变量的值更改为其他值，这是标记中呈现的内容。

现在，在标记中添加 if 条件。在<包含“提交”按钮的 p> 元素下，添加以下标记：

@if(IsPost){
  <p>You submitted the page at @DateTime.Now</p>
}

你要在标记中添加代码，因此必须以 @开头。然后是一个 if 测试，类似于前面在代码块中添加的测试。不过，在大括号内，你正在添加普通 HTML - 至少，在到达 @DateTime.Now之前，它是普通的。这是另一点 Razor 代码，因此必须再次在它的前面添加 @ 。

此处的要点是，可以在顶部的代码块和标记中添加 if 条件。如果在页面正文中使用 if 条件，块内的行可以是标记或代码。在这种情况下，只要混合使用标记和代码，必须使用 @ 来明确 ASP.NET 代码的位置。

运行页面并单击“ 提交”。这一次，您不仅在提交 (“现在已提交...”) 时看到不同的消息，还会看到列出日期和时间的新邮件。

Web 浏览器中运行的“测试 Razor 2”页面的屏幕截图，其中显示了页面提交后的时间戳消息。

测试查询字符串的值

再测试一次。这一次，你将添加一个 if 块，用于测试可能在查询字符串中传递的名为 show 的值。 (如下所示： http://localhost:43097/TestRazorPart2.cshtml?show=true) 你将更改页面，以便仅当 show 的值为 true 时，才会显示你一直显示的消息 (“这是第一次...”) ，等等。

在底部 (但) 页面顶部的代码块内，添加以下内容：

var showMessage = false;
if(Request.QueryString["show"].AsBool() == true) {
    showMessage = true;
}

完整的代码块现在如以下示例所示。 (请记住，将代码复制到页面中时，缩进可能有所不同。但这不会影响代码的运行方式。)

@{
   var message = "This is the first time you've requested the page.";

   if(IsPost) {
      message = "Now you've submitted the page.";
   }

   var showMessage = false;
   if(Request.QueryString["show"].AsBool() == true) {
     showMessage = true;
   }
}

块中的新代码将名为 showMessage 的变量初始化为 false。然后，它执行 if 测试以查找查询字符串中的值。首次请求页面时，其 URL 如下所示：

http://localhost:43097/TestRazorPart2.cshtml

代码确定 URL 是否在查询字符串中包含名为 show 的变量，如以下版本的 URL：

http://localhost:43097/TestRazorPart2.cshtml？show=true

测试本身查看 Request 对象的 QueryString 属性。如果查询字符串包含名为 show 的项，并且该项设置为 true，则 if 块将运行并将 showMessage 变量设置为 true。

正如你所看到的，这里有一个技巧。与名称一样，查询字符串是一个字符串。但是，仅当要测试的值是布尔值 (true/false) 值时，才能测试 true 和 false。在测试查询字符串中的 show 变量的值之前，必须将其转换为布尔值。这就是 AsBool 方法的作用 - 它采用字符串作为输入，并将其转换为布尔值。显然，如果字符串为“true”，AsBool 方法会将该值转换为 true。如果字符串的值为任何其他值，则 AsBool 返回 false。

提示

数据类型和 As () 方法

到目前为止，我们只说过，在创建变量时，将使用关键字 (keyword) var。不过，这不是整个故事。为了操作值（要添加数字、连接字符串、比较日期或测试 true/false），C# 必须处理值的适当内部表示形式。 C# 通常可以确定应该 (即，根据对值执行的操作) 数据类型。不过，时不时地，它不能做到这一点。如果没有，则必须通过显式指示 C# 应如何表示数据来提供帮助。 AsBool 方法这样做 — 它告知 C# 应将字符串值“true”或“false”视为布尔值。也有类似的方法将字符串表示为其他类型，例如 AsInt (将视为整数) 、AsDateTime (视为日期/时间) 、AsFloat (将视为浮点数) 等等。使用这些 As ( ) 方法时，如果 C# 无法按请求表示字符串值，则会看到错误。

在页面的标记中，删除或注释掉此元素 (此处显示注释) ：

<!-- <p>@message</p> -->

在删除或注释掉该文本的位置，添加以下内容：

@if(showMessage) {
  <p>@message</p>
}

if 测试指出，如果 showMessage 变量为 true，则呈现具有 <message 变量值的 p> 元素。

条件逻辑摘要

如果你不能完全确定你刚刚执行的操作，下面是一个摘要。

消息变量初始化为默认字符串 (“这是第一次...”) 。
如果页面请求是提交 (帖子) 的结果，则消息的值将更改为“现已提交...”
showMessage 变量初始化为 false。
如果查询字符串包含？show=true，则 showMessage 变量设置为 true。
在标记中，如果 showMessage 为 true，则会呈现一个 <p> 元素来显示 message 的值。 (如果 showMessage 为 false，则标记中此时不会呈现任何内容 )
在标记中，如果请求是帖子，则会呈现一个 <p> 元素，该元素显示日期和时间。

运行页面。没有消息，因为 showMessage 为 false，因此在标记中，如果 (showMessage) 测试返回 false。

单击“提交” 。可以看到日期和时间，但仍没有消息。

在浏览器中，转到 URL 框，将以下内容添加到 URL 的末尾：？show=true，然后按 Enter。

Web 浏览器中“Test Razor 2”页的屏幕截图，其中显示了 U R L 框中的查询字符串。

页面将再次显示。 (由于更改了 URL，因此这是一个新请求，而不是提交。) 再次单击“ 提交 ”。消息将再次显示，日期和时间也显示。

网页提交后 Web 浏览器中的“Test Razor 2”页的屏幕截图，其中包含 U R L 框中的查询字符串。

在 URL 中，将？show=true 更改为？show=false，然后按 Enter。再次提交页面。页面已返回到你的启动方式 - 没有消息。

如前所述，此示例的逻辑是有点阴谋的。但是，如果要出现在你的许多页面中，则需要你在此处看到的一个或多个表单。

安装帮助程序 (显示 Gravatar 映像)

人们经常希望在网页上执行的某些任务需要大量代码或需要额外的知识。示例：显示数据的图表;在页面上放置Facebook“赞”按钮;从网站发送电子邮件;裁剪或调整图像大小;为网站使用 PayPal。为了便于执行此类操作，ASP.NET 网页允许使用帮助程序。帮助程序是为站点安装的组件，可用于仅使用几行 Razor 代码来执行典型任务。

ASP.NET 网页内置了几个帮助程序。但是，使用 NuGet 包管理器提供的包 (加载项) 中提供了许多帮助程序。 NuGet 允许选择要安装的包，然后它负责安装的所有详细信息。

在本教程的这一部分，你将安装一个帮助程序，用于显示 Gravatar (“全局识别的虚拟形象”) 图像。你将了解两件事。一个是如何查找和安装帮助程序。你还将了解帮助程序如何使用大量必须自行编写的代码，轻松地执行本来需要执行的操作。

可以在的 Gravatar 网站上 http://www.gravatar.com/注册自己的 Gravatar，但不需要创建 Gravatar 帐户来执行本教程的这一部分。

在 WebMatrix 中，单击“ NuGet” 按钮。

Web 矩阵用户界面的屏幕截图，其中突出显示了“Nu 获取”按钮，并带有红色矩形。

这会启动 NuGet 包管理器并显示可用的包。 (并非所有包都是帮助程序;有些向 WebMatrix 本身添加了功能，有些是其他模板，等等。) 你可能会收到有关版本不兼容的错误消息。可以通过单击“ 确定 ”并继续学习本教程来忽略此错误消息。

Web 矩阵中 Nu Get 库对话框的屏幕截图，其中显示了要安装的可用包的列表。

在搜索框中，输入“asp.net 帮助程序”。 NuGet 显示与搜索词匹配的包。

Web 矩阵中 Nu Get 库对话框的屏幕截图，其中突出显示了带有红色矩形的 A S P 点 N E T Web 帮助程序库项。

ASP.NET Web 帮助程序库包含用于简化许多常见任务的代码，包括使用 Gravatar 图像。选择 “ASP.NET Web 帮助程序库 ”包，然后单击“ 安装 ”以启动安装程序。当系统询问是否要安装包时，请选择“ 是 ”，并接受条款以完成安装。

就这么简单。 NuGet 下载并安装所有内容，包括可能需要 (依赖项) 的任何其他组件。

如果出于某种原因必须卸载帮助程序，则该过程非常相似。单击 “NuGet” 按钮，单击“ 已安装 ”选项卡，然后选择要卸载的包。

在页面中使用帮助程序

现在，你将使用刚刚安装的帮助程序。将帮助程序添加到页面的过程与大多数帮助程序的过程类似。

在 WebMatrix 中，创建一个页面并将其命名为 GravatarTest.cshml。 (你正在创建一个特殊页面来测试帮助程序，但你可以在网站中的任何页面中使用帮助程序。)

在 body 元素内<，添加 <div> 元素。> 在 div> 元素中<，键入以下命令：

@Gravatar.

@ 字符是用于标记 Razor 代码的相同字符。 Gravatar 是正在使用的帮助程序对象。

键入句点 (.) 后，WebMatrix 就会显示 Gravatar 帮助程序提供的) 函数 (方法 列表：

源编辑器的屏幕截图，其中显示了 Gravatar 帮助程序 IntelliSense 下拉列表，其中“获取 H T M L”项以黄色突出显示。

此功能称为 IntelliSense。它通过提供适合上下文的选项来帮助编码。 IntelliSense 适用于 HTML、CSS、ASP.NET 代码、JavaScript 和 WebMatrix 中支持的其他语言。这是另一项功能，可更轻松地在 WebMatrix 中开发网页。

按键盘上的 G，会看到 IntelliSense 找到 GetHtml 方法。按 Tab。IntelliSense 将插入所选方法 (GetHtml) 。键入一个左括号，并注意自动添加右括号。在两个括号之间用引号键入电子邮件地址。如果你有 Gravatar 帐户，则会返回你的个人资料图片。如果没有 Gravatar 帐户，则返回默认图像。完成后，该行如下所示：

@Gravatar.GetHtml("john@contoso.com")

现在，在浏览器中查看页面。显示你的图片或默认图像，具体取决于你是否有 Gravatar 帐户。

Web 浏览器窗口的屏幕截图，其中显示了用户选择的戴着眼镜的男子的 Gravatar 图像。 Web 浏览器窗口的屏幕截图，其中显示了样式化和旋转字母 G 的默认 Gravatar 图像。

若要了解帮助程序正在为你执行的操作，请在浏览器中查看页面的源。除了页面中的 HTML 之外，还会看到包含标识符的图像元素。这是帮助程序呈现到你拥有 @Gravatar.GetHtml的位置的页面的代码。帮助程序获取你提供的信息，并生成了直接与 Gravatar 通信的代码，以便为提供的帐户取回正确的图像。

GetHtml 方法还允许通过提供其他参数来自定义映像。以下代码演示如何请求宽度和高度为 40 像素的图像，并在指定的帐户不存在时使用名为 wavatar 的指定默认图像。

@Gravatar.GetHtml("john@contoso.com", 40, "wavatar")

此代码生成类似于以下结果， (默认图像) 会随机变化。

Web 浏览器页面的屏幕截图，其中显示了新的指定默认图像，其中包含 Get H T M L 方法中定义的设置参数。

即将上一步

为使本教程保持简短，我们只需要重点介绍几个基础知识。当然，Razor 和 C# 还有很多内容。通过这些教程，你将了解详细信息。如果你现在有兴趣详细了解 Razor 和 C# 的编程方面，可以在此处阅读更全面的介绍：使用 Razor 语法 ASP.NET Web 编程简介。

下一教程介绍如何使用数据库。在该教程中，你将开始创建示例应用程序，以便列出喜欢的电影。

TestRazor 页面的完整列表

@{
   // Working with numbers
   var a = 4;
   var b = 5;
   var theSum = a + b;

   // Working with characters (strings)
   var technology = "ASP.NET";
   var product ="Web Pages";

   // Working with objects
   var rightNow = DateTime.Now;
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Testing Razor Syntax</title>
    <meta charset="utf-8" />
    <style>
    body {font-family:Verdana; margin-left:50px; margin-top:50px;}
    div {border: 1px solid black; width:50%; margin:1.2em;padding:1em;}
    span.bright {color:red;}
    </style>
  </head>
<body>
  <h1>Testing Razor Syntax</h1>
  <form method="post">

    <div>
      <p>The value of <em>a</em> is @a.  The value of <em>b</em> is @b.
      <p>The sum of <em>a</em> and <em>b</em> is <strong>@theSum</strong>.</p>
      <p>The product of <em>a</em> and <em>b</em> is <strong>@(a*b)</strong>.</p>
    </div>

    <div>
      <p>The technology is @technology, and the product is @product.</p>
      <p>Together they are <span class="bright">@(technology + " " + product)</span></p>
   </div>

   <div>
     <p>The current date and time is: @rightNow</p>
     <p>The URL of the current page is<br/><br/><code>@Request.Url</code></p>
   </div>

  </form>
</body>
</html>

TestRazorPart2 页面的完整列表

@{
   var message = "This is the first time you've requested the page.";

   if (IsPost) {
      message = "Now you've submitted the page.";
   }

   var showMessage = false;
   if (Request.QueryString["show"].AsBool() == true) {
     showMessage = true;
   }
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Testing Razor Syntax - Part 2</title>
    <meta charset="utf-8" />
    <style>
      body {font-family:Verdana; margin-left:50px; margin-top:50px;}
      div {border: 1px solid black; width:50%; margin:1.2em;padding:1em;}
    </style>
  </head>
  <body>
  <h1>Testing Razor Syntax - Part 2</h1>
  <form method="post">
    <div>
      <!--<p>@message</p>-->
      @if(showMessage){
        <p>@message</p>
      }
      <p><input type="submit" value="Submit" /></p>
      @if (IsPost) {
        <p>You submitted the page at @DateTime.Now</p>
      }
    </div>
  </form>
</body>
</html>

GravatarTest 页面的完整列表

@{
}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <div>
          @Gravatar.GetHtml("john@contoso.com")
          @Gravatar.GetHtml("john@contoso.com", 40, "wavatar")
        </div>
    </body>
</html>