C# 如何动态更改css样式

我试图改变css风格的中继器，以不同的颜色在不同的状态。预期输出是打印6种不同的状态，如：进行中、完成、撤回等。。目前它只有一种颜色，所以它只显示一种颜色。这里最具挑战性的部分是根据状态动态更改颜色。我如何做到这一点？目前，它基于下面的“status noAction text center”类提取样式。我应该对后台代码进行任何更改，还是只是前端css更改。有人能给我举个例子吗

.aspx代码：

<div class="row">
                <asp:Repeater ID="rptStatuses" runat="server">
                    <ItemTemplate>
                        <div class="col-md-4 col-sm-4">
                            <div class="status noAction text-center">
                                <div class="banner">

                                    <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
                                </div>
                                <div class="label"><%# Eval("Name") %></div>
                            </div>
                        </div>
                    </ItemTemplate>
                </asp:Repeater>

.cs代码相关部分

private void GB()
        {

            var surveyId = 55;
            var stateLabels = _manageDatasets.GetStateLabels(surveyId);
            List<Status> statusesList = new List<Status>();
            foreach (var sl in stateLabels)
            {
                if (sl.Key != -1)
                    statusesList.Add(new Status { ID = sl.Key.ToString(), Name = sl.Value }
                  );
            }
            this.rptStatuses.DataSource = statusesList;
            this.rptStatuses.DataBind();
}

private void GB（）
{
var surveyId=55；
var stateLabels=\u managedataset.GetStateLabels（surveyId）；
列表状态列表=新列表（）；
foreach（stateLabels中的var sl）
{
如果（sl.Key！=-1）
statusesList.Add（新状态{ID=sl.Key.ToString（），Name=sl.Value}
);
}
this.rptStatuses.DataSource=statusesList；
this.rptstatus.DataBind（）；
}

我认为您要做的是更改html中的类，只需使用嵌入的代码即可根据状态动态更改横幅颜色等。您想要的嵌入式代码看起来像这样-

<div class="col-md-4 col-sm-4">
    <% if(status == "noAction") { %>
        <div class="status noAction text-center">
            <div class="banner">

                <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
            </div>
            <div class="label"><%# Eval("Name") %></div>
        </div>
    <% } %>

---

我认为您要做的是更改html中的类，只需使用嵌入的代码即可根据状态动态更改横幅颜色等。您想要的嵌入式代码看起来像这样-

<div class="col-md-4 col-sm-4">
    <% if(status == "noAction") { %>
        <div class="status noAction text-center">
            <div class="banner">

                <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
            </div>
            <div class="label"><%# Eval("Name") %></div>
        </div>
    <% } %>

---

若您的表中有任何列是从repeater获取数据源的，那个么这将非常容易做到 诸如此类

 <asp:Repeater ID="rptStatuses" runat="server">
                <ItemTemplate>
                    <div class="col-md-4 col-sm-4">
                        <div class='<%# Convert.toInt32(eval("ActionColumnName"))==1 ? "status In progress text-center" : Convert.toInt32(eval("ActionColumnName"))==2 ? "status complete  text-center" : Convert.toInt32(eval("ActionColumnName"))==3 ? "status withdrawn text-center" : "status noAction text-center" '>
                            <div class="banner">

                                <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
                            </div>
                            <div class="label"><%# Eval("Name") %></div>
                        </div>
                    </div>
                </ItemTemplate>
            </asp:Repeater>

---

若您的表中有任何列是从repeater获取数据源的，那个么这将非常容易做到 诸如此类

 <asp:Repeater ID="rptStatuses" runat="server">
                <ItemTemplate>
                    <div class="col-md-4 col-sm-4">
                        <div class='<%# Convert.toInt32(eval("ActionColumnName"))==1 ? "status In progress text-center" : Convert.toInt32(eval("ActionColumnName"))==2 ? "status complete  text-center" : Convert.toInt32(eval("ActionColumnName"))==3 ? "status withdrawn text-center" : "status noAction text-center" '>
                            <div class="banner">

                                <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
                            </div>
                            <div class="label"><%# Eval("Name") %></div>
                        </div>
                    </div>
                </ItemTemplate>
            </asp:Repeater>