使用 _Layout.cshtml 在 Razor Pages 中查看特定的 css

Question

我有一个带有<head>部分的_Layout.cshtml文件，如下所示：

<head>
    <title>Dashboard</title>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/layout.css"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

我有一个名为Index.cshtml的视图（即使用_Layout.cshtml作为布局），其<head>部分如下所示：

<head>
    <link rel="stylesheet" href="css/Home/Index.css"/>
    <script src="https://cdn.datatables.net/v/bs/jq-3.2.1/dt-1.10.16/datatables.min.js"></script>
    <link href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css" rel="stylesheet" />
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
</head>

现在Index.cshtml这一行正确地设置了我的 DataTables 样式，但是即使它位于Index.cshtml而不是_Layout.cshtml ，它也会弄乱我的布局页面：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

我一定对我的 css 在整个网络应用程序中的工作方式有点困惑。 我试过使用@section但我也无法使用它。

所以我的问题是如何使Index.cshtml的 css 仅适用于该页面而不影响_Layout.cshtml的 css？

Answer 1

在您的_Layout.cshtml使用RenderSection方法并将所需参数设置为 false：

<head>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
    ....
    @RenderSection("head",false)
</head>

然后在您看来，需要额外的 css：

@section head {      
  <link href="my_view_specific_css.css" rel="stylesheet" />    
}

使用 _Layout.cshtml 在 Razor Pages 中查看特定的 css

问题描述

1 个解决方案

解决方案1
0 2017-11-14 14:22:58

使用 _Layout.cshtml 在 Razor Pages 中查看特定的 css

问题描述

1 个解决方案

解决方案1 0 2017-11-14 14:22:58

解决方案1
0 2017-11-14 14:22:58