Question

我是asp.net mvc的新手，我的问题是，我想有条件地将CSS背景颜色添加到一组表行，基于BILL-AMOUNT = 0.00我有这样的代码

@model IEnumerable

查看

<tbody>
    @foreach (var item in Model)
    {
        <tr>
            <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.TicketNo)</td>
            <td style="padding-left: 12px; display: none;">@Html.DisplayFor(modelItem => item.name)</td>
            <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.ArrDate)</td>
            <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.quantity)</td>
            <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.Total)</td>
            <td>@Html.DisplayFor(modelItem => item.Refund)</td>
            <td>@Html.DisplayFor(modelItem => item.TotalAmount)</td>    
        </tr>
    }
</tbody>

Answer 1

假设你有一个班级：

.tr-zero {
    background-color: #cccccc;
}

您可以像这样有条件地添加课程：

<tr@(item.TotalAmount == 0 ? " class=\"tr-zero\"" : string.Empty)>

Answer 2

<tbody>
          @foreach (var item in Model)
            {
              <tr bgcolor='@(item.AMOUNT==0? "#FFF":"#EEE")'>
              <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.TicketNo)</td>
               <td style="padding-left: 12px; display: none;">@Html.DisplayFor(modelItem => item.name)</td>
               <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.ArrDate)</td>
               <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.quantity)</td>
               <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.Total)</td>
               <td>@Html.DisplayFor(modelItem => item.Refund)</td>
               <td>@Html.DisplayFor(modelItem => item.TotalAmount)</td>    
                    </tr>
                   }

Answer 3

        <tbody>
        @foreach (var item in Model)
        {
          <tr style="background-color:@(Convert.ToInt32(item.TotalAmount) == 0?"RedColor":"GreenColor")">
          <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.TicketNo)</td>
           <td style="padding-left: 12px; display: none;">@Html.DisplayFor(modelItem => item.name)</td>
           <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.ArrDate)</td>
           <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.quantity)</td>
           <td style="padding-left: 12px;">@Html.DisplayFor(modelItem => item.Total)</td>
           <td>@Html.DisplayFor(modelItem => item.Refund)</td>
           <td>@Html.DisplayFor(modelItem => item.TotalAmount)</td>    
          </tr>
         }
    </tbody>

如何在mvc foreach循环中应用Style Css

3 个答案: