Asp.net core 如何在.net内核背后的代码中更改元素的样式

如何更改控制器中div的类/样式？我试着使用

runat

，但没用。这里有一个例子

<div id="MainDiv" class="flex justify-between items-center">
     <a>Done</a>
 </div>

多恩

---

如果某些条件适用，如何将

bg-red-300

类添加到

MainDiv

，如果不添加

bg-green-300

类，则如何将

class添加到
MainDiv？
第一种方式，您可以如下判断客户端的数据：

@model Test
<div id="MainDiv" class="flex justify-between items-center @(Model.IsDone=="Yes"?"bg-red-300":"bg-green-300")">

第二种方法，可以使用ViewData在服务器端存储类和判断：

Index.cshtml：

@{
    var styleClass = ViewData["Style"];
}

<div id="MainDiv" class="flex justify-between items-center @styleClass">
    <a>Done</a>
</div>

我将假设您有一个支持您的视图的模型，带有一些布尔类型的C#属性，该属性将定义此字段是否有效，让我们称之为
valid
。通常，这种验证是基于一些更复杂的逻辑，所以我假设你有类似的东西

您可以内联编辑样式，或者替换整个HTML视图块，具体取决于您需要基于此模型值更改的视图的多少

这两种方法都有文档记录，供您最终使用。
我看到您使用的是tailwindcss，所以我只是复制了这个样式

使用系统；
名称空间示例应用程序
{
公共类SampleViewModel
{
公共布尔有效{get；set；}
}
}

控制器示例：

public IActionResult Index()
{
    var model = new Test()
    {
        IsDone=="Yes"
    };
    return View(model);
}

public IActionResult Index()
{
    if(YourCondition)
    {
        ViewData["Style"] = "bg-red-300";
    }
    else
    {
        ViewData["Style"] = "bg-green-300";
    }
    return View();
}

使用系统；
使用System.Web.Mvc；
名称空间示例应用程序
{
公共类HomeController:控制器
{
[HttpGet]
公共行动结果索引（）
{
var模型=新的SampleViewModel（）；
model.Valid=false；
返回视图（模型）；
}
}
}

和示例视图：

@model ExampleApp.SampleViewModel
@{
布局=空；
}
基于模型的Css
.bg-red-300{
背景色：#feb2b2；
}
多恩
@if（Model.Valid）
{
多恩
}
其他的
{
多恩
}
多恩

我发布了一个简单的.net提琴供您现场查看：