在 ASP .NET MVC 5 中动态更改布局或样式表

本文关键字：布局 样式 动态 NET ASP MVC | 更新日期: 2023-09-27 18:35:18

我正在用ASP .NET MVC 5开发Web应用程序，我需要在那里有一些按钮来改变布局中的样式（另一个.css文件）。我已经尝试了jQuery + COOKIES解决方案 - 它可以工作，但是在页面加载时仍然有其他样式可见。

在MVC 5中是否有其他（更好）的解决方案？没有必要有 COOKIE（当用户返回默认样式可以加载时）。单击某些按钮后，所有页面将使用第二种样式，再次单击后将再次使用默认样式。也许通过使用一些路由属性或类似的东西。

非常感谢每一个建议！

在 ASP .NET MVC 5 中动态更改布局或样式表

这只是一种方法 - 取决于更改的广泛程度（或不广泛）：杠杆sections

您通常会在样板中显示@section，这些是您想要从View"注入"的任何内容的"占位符"。

例：

  • Views/Shared/_Layout.cshtml定义<head />中的可选Section 

    <title>@ViewBag.Title</title> 
<!--this could be your "base" style-->
@Styles.Render("~/Content/css")
 <!--this could be your "override" style-->
@RenderSection("OverrideStyles", false)

  • 在View或_ViewStart中（以便您可以在一个位置设置多个视图的样式），根据需要使用它

    @section OverrideStyles
{
    @if (DateTime.Now.Second % 2 == 0) //Some expression or some value from controller....
    {
        <style>
            div.jumbotron h1 {
                color: #ff0000;
            }
        </style>
    }
    else
    {
        <link rel="stylesheet" type="text/css" href="//cdn.sstatic.net/stackoverflow/all.css?v=693004a3f56e">
    }
}
<div class="jumbotron">
    <h1>ASP.NET</h1>
    <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS, and JavaScript.</p>
    <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
</div>

您可以从那里扩展 - 如有必要，甚至可以动态设置整个_Layout。

例如 _ViewStart.cshtml 

@{
    if (DateTime.Now.Second % 2 == 0)
    {
        Layout = "~/Views/Shared/_Layout.cshtml";
    }
    else
    {
        Layout = "~/Views/Shared/_Layout-bar.cshtml";
    }
}

呵......

最后，我使用 HttpContext.Session 属性在控制器中保存有关用户选择样式的信息，并根据此会话存储的信息呈现正确的样式。

但是非常感谢您的所有答案！

相关文章：