css – 为什么我收到错误信息“元素”样式不能嵌套在元素“风格”中？

我需要覆盖一些< 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'>

我已经仔细检查了主页 – 没有突出显示的问题.

目前Visual Studio期待什么？什么是逐页覆盖样式的正确方法？通过jQuery？

解决方法

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在组成单个页面的标记在这样的不同文件之间被分割时有问题.在大多数情况下,Visual Studio(或任何此类IDE)无法知道如何将不同的页面片段动态地放在一起.所以通常你不能避免某些项目的警告.

如果我知道我在做什么,结果页面通过标记验证(http://validator.w3.org/),我个人就会忽略这些警告.

如果您真的想隐藏警告,则需要在Visual Studio中禁用相应的验证选项.例如.对于Visual Studio 2012中的HTML,可以在Tools>选项>文本编辑器> HTML>验证.

css – 为什么我收到错误信息“元素”样式不能嵌套在元素“风格”中？

解决方法

猜你在找的CSS相关文章