我需要覆盖一些< style>我的Razor页面中的元素,所以我已经插入样式后立即开始的代码块：
@{
ViewBag.Title = "New Account";
Layout = "~/Views/Shared/_Layout_Form.cshtml";
}
<style type="text/css">
#main
{
height: 400px;
}
</style>
该页面在浏览器中正确呈现,但Visual Studio绿色在< style>抱怨：
<Validation (XHTML 1.0 Transitional): Element 'style' cannot be nested within element 'style'>
我已经仔细检查了主页 – 没有突出显示的问题.
解决方法
style元素不能嵌套在< body>下面或< body>的子元素,而应该转到< head>页面元素.
如果您尝试覆盖这样的样式,它们将被@RenderBody()插入到布局页面的默认部分,我假定它位于< body>,而默认样式仍然保留在< head>中.
从内容页面覆盖布局页面的某些部分的正确方法将是使用Razor部分的这些方面：
_layout.cshtml
<head>
@if (IsSectionDefined("Style"))
{
@RenderSection("Style");
}
else
{
<style type="text/css">
/* Default styles */
</style>
}
</head>
<body>
@RenderBody()
...
page.cshtml
@{
Layout = "layout.cshtml";
}
@section Style
{
<style type="text/css">
#main
{
height: 400px;
}
</style>
}
<!-- Body content here -->
...
现在如果在内容页面上定义了Style部分,其内容将覆盖布局页面中的默认值.
我建议你阅读更多关于剃须刀布局和部分. ScottGu的一篇很好的文章可以发现here.
Visual Studio在组成单个页面的标记在这样的不同文件之间被分割时有问题.在大多数情况下,Visual Studio(或任何此类IDE)无法知道如何将不同的页面片段动态地放在一起.所以通常你不能避免某些项目的警告.
如果我知道我在做什么,结果页面通过标记验证(http://validator.w3.org/),我个人就会忽略这些警告.
如果您真的想隐藏警告,则需要在Visual Studio中禁用相应的验证选项.例如.对于Visual Studio 2012中的HTML,可以在Tools>选项>文本编辑器> HTML>验证.
