仅仅为了那个视图而切换CSS？_Css_Asp.net Mvc 4_Razor_View

仅仅为了那个视图而切换CSS？

css asp.net-mvc-4 razor view

仅仅为了那个视图而切换CSS？,css,asp.net-mvc-4,razor,view,Css,Asp.net Mvc 4,Razor,View,我想根据用户选择将不同的css样式应用于视图。最初，视图应该使用\u ViewStart.cshtml和\u Layout.cshtml。当用户单击预览按钮时，我希望视图使用\u Layout2.cshtml，并将css切换为仅应用于该视图但这似乎适用于所有观点。有什么提示吗？我犯了什么错误？我的代码如下： Create.cshmtl: @model SurveyTool.Models.SampleQuestionViewModel @{ ViewBag.Title = "Dum

我想根据用户选择将不同的css样式应用于视图。最初，视图应该使用

\u ViewStart.cshtml

和

\u Layout.cshtml

。当用户单击预览按钮时，我希望视图使用

\u Layout2.cshtml

，并将css切换为仅应用于该视图

但这似乎适用于所有观点。有什么提示吗？我犯了什么错误？我的代码如下：

Create.cshmtl:

@model SurveyTool.Models.SampleQuestionViewModel

@{
    ViewBag.Title = "DummyQuestionList";
    Layout = "~/Views/Shared/_Layout2.cshtml";

    if (Model.Survey_Template == "Style1")
    {
        <link href="Site.css" rel="stylesheet"
              type="text/css" />
    }
    else if (Model.Survey_Template == "Style2")
    {
        <link href="Type1.css" rel="stylesheet"
              type="text/css" />
    }
    else if (Model.Survey_Template == "Style3")
    {
        <link href="Type2.css" rel="stylesheet"
              type="text/css" />
    }
}

<h2>@Model.Survey_Template DummyQuestionList</h2>
<br/>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>SampleQuestionViewModel</legend>

        <div class="editor-label">
            @Html.HiddenFor(model => model.Survey_Template)
        </div>

        <div class="editor-field">
            @Html.EditorFor(model => model.Survey_Template)
            @Html.ValidationMessageFor(model => model.Survey_Template)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Question1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Question1)
            @Html.ValidationMessageFor(model => model.Question1)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Question2)
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Question2)
            @Html.ValidationMessageFor(model => model.Question2)
        </div>
    </fieldset>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Infineon Survey Tool</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/Site.css")
    @Styles.Render("~/Content/themes/base/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")

</head>
<body id="@ViewBag.Title">

    <div id="body">
        @RenderSection("featured", required: false)
        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>


    @RenderSection("scripts", required: false)
</body>
</html>

@model SurveyTool.Models.SampleQuestionViewModel
@{
ViewBag.Title=“DummyQuestionList”；
Layout=“~/Views/Shared/_Layout2.cshtml”；
如果（Model.Survey_Template==“Style1”）
{
}
else if（Model.Survey_Template==“Style2”）
{
}
else if（Model.Survey_Template==“Style3”）
{
}
}
@Model.Survey_模板Dummy问题列表


@使用（Html.BeginForm（））
{
@Html.AntiForgeryToken（）
@Html.ValidationSummary（true）
样本问题视图模型
@Html.HiddenFor（model=>model.Survey_模板）
@EditorFor（model=>model.Survey_模板）
@Html.ValidationMessageFor（model=>model.Survey_模板）
@LabelFor（model=>model.Question1）
@EditorFor（model=>model.Question1）
@Html.ValidationMessageFor（model=>model.Question1）
@LabelFor（model=>model.Question2）
@Html.TextAreaFor（model=>model.Question2）
@Html.ValidationMessageFor（model=>model.Question2）
}
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
}

\u Layout2.cshtml:

@model SurveyTool.Models.SampleQuestionViewModel

@{
    ViewBag.Title = "DummyQuestionList";
    Layout = "~/Views/Shared/_Layout2.cshtml";

    if (Model.Survey_Template == "Style1")
    {
        <link href="Site.css" rel="stylesheet"
              type="text/css" />
    }
    else if (Model.Survey_Template == "Style2")
    {
        <link href="Type1.css" rel="stylesheet"
              type="text/css" />
    }
    else if (Model.Survey_Template == "Style3")
    {
        <link href="Type2.css" rel="stylesheet"
              type="text/css" />
    }
}

<h2>@Model.Survey_Template DummyQuestionList</h2>
<br/>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>SampleQuestionViewModel</legend>

        <div class="editor-label">
            @Html.HiddenFor(model => model.Survey_Template)
        </div>

        <div class="editor-field">
            @Html.EditorFor(model => model.Survey_Template)
            @Html.ValidationMessageFor(model => model.Survey_Template)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Question1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Question1)
            @Html.ValidationMessageFor(model => model.Question1)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Question2)
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Question2)
            @Html.ValidationMessageFor(model => model.Question2)
        </div>
    </fieldset>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Infineon Survey Tool</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/Site.css")
    @Styles.Render("~/Content/themes/base/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")

</head>
<body id="@ViewBag.Title">

    <div id="body">
        @RenderSection("featured", required: false)
        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>


    @RenderSection("scripts", required: false)
</body>
</html>


英飞凌测量工具
@style.Render（“~/Content/Site.css”）
@style.Render（“~/Content/themes/base/css”）
@Scripts.Render（“~/bundles/modernizer”）
@Scripts.Render（“~/bundles/jquery”）
@Scripts.Render（“~/bundles/jqueryui”）
@渲染部分（“特色”，必填项：false）
@RenderBody（）
@RenderSection（“脚本”，必需：false）

如果将CSS命名为名称空间，并在正文中添加一个类，则无需切换样式表即可完成此操作。然后，单击按钮时，可以使用JS更改此类

SASS中的一个示例：

.stylesheet-1 {
  .style-1 {

  }
  .style-2 {

  }
}

.stylesheet-2 {
  .style-1 {

  }
  .style-2 {

  }  

  .style-3 {

  }

}

你能创建一个fiddle hi@GuruprasadRao吗？我不知道如何使用它：（只需转到该链接并粘贴必要的代码和样式表！！就这样..：）@GuruprasadRao，这是链接。我觉得出了点问题。。