代码块与 HTML 混写

1. 在@{ }代码块内部，可以直接写HTML代码。
2. cshtml 修改后不需要编译，直接运行就能看到效果。
3. @Html.Raw("")：输出原生HTML，不会做HTML转义。

代码块内混写HTML

@{
    //字符串拼接
    string lastYear2 = "2013";
    string thisYear2 = "2014";

    //代码块内部，直接写HTML标签输出
    <font>今年是：</font><b>@(lastYear2+thisYear2)</b>
}Code language: JavaScript (javascript)

注意：@(表达式)后面不要加分号;，这里是输出表达式，不是C#语句。

---

特殊符号输出规则

1. 输出@符号：用@@，页面就会渲染出一个@

@@

2. 输出邮箱：Razor自动识别邮箱格式，直接写即可，不需要额外转义

<p>ddd@gmail.com</p>Code language: HTML, XML (xml)

3. @:语法：在代码块内部，把后面内容当做纯文本输出

@{
    @:Tom@gmail.com
}

输出HTML的两种方式

默认@变量会对HTML进行转义，标签会原样显示到页面，不会解析。

1 HtmlString 对象

@{
    string html = "<font color='red'>文本</font>";
    HtmlString shtml = new HtmlString("<font color='red'>文本</font>");
}

@html      @* 会转义，页面显示完整标签字符串 *@
@shtml     @* 不会转义，解析HTML标签 *@Code language: HTML, XML (xml)

2@Html.Raw()

@{
    string html = "<font color='red'>文本</font>";
}
@Html.Raw(html)Code language: HTML, XML (xml)

重要规则

a. 代码块作用域内，如果一行以HTML标签开头，直接视为文本输出；
b. 想要输出字符@，写@@；
c. 代码块内输出普通文本（不是HTML标签），使用@:；@:后面依旧可以使用@变量输出Razor表达式。

完整示例

@{
    string html = "<font color='red'>文本</font>";
    HtmlString shtml = new HtmlString("<font color='red'>文本</font>");
}

@@
<strong>dd</strong>
@html<br/>
@shtml<br />
@Html.Raw(html)

<p>ddd@qq.com</p>
<p>ddd@qq</p>
<p>1@1</p>
<p>1@f</p>Code language: HTML, XML (xml)

关键总结

写法	效果
@普通字符串变量	HTML特殊字符转义，防止XSS
@Html.Raw(字符串)	不转义，直接输出HTML
new HtmlString("xxx")	等价Html.Raw，不转义
@@	输出一个@字符
@:	代码块内输出纯文本

安全提醒：Html.Raw不要直接输出用户提交的内容，会产生XSS漏洞。