应用不同的颜色，以一个单选按钮列表的不同项目 [英] Apply different colors to different items of a RadioButtonList

问题描述

我有一个单选按钮列表这样的：

<asp:RadioButtonList ID="rbl1" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" SelectedValue='<%#Bind("A1") %>'>
  <asp:ListItem runat="server" Text="1" Value="1" class="radiobuttonlist"></asp:ListItem>
  <asp:ListItem runat="server" Text="2" Value="2" class="radiobuttonlist"></asp:ListItem>
  <asp:ListItem runat="server" Text="3" Value="3" class="radiobuttonlist"></asp:ListItem>
  <asp:ListItem runat="server" Text="4" Value="4" class="radiobuttonlist"></asp:ListItem>
  <asp:ListItem runat="server" Text="5" Value="5" class="radiobuttonlist"></asp:ListItem>
</asp:RadioButtonList>

我想申请红色到列表项，其值 1，黄色到列表项，其值 2，绿色的列表项，其值 3等on.How做呢？

I want to apply red color to the ListItem that its value is 1, yellow to the ListItem that its value is 2, green to the ListItem that its value is 3 and so on.How do I do It?

我使用ASP.Net Web表单。无论是jQuery的或CSS就可以了。

I am using ASP.Net web forms. Either jQuery or CSS will do.

问题是，我有10个以上的单选按钮列表。我有一个像我在这个问题上面提到的设置颜色为所有的人。每个单选按钮列表显然有不同的ID，但他们都有5个选项。什么是完成这一任务的最好方法是什么？

The problem is that I have more than 10 radio button lists. I have to set color to all of them like I have mentioned in the question above. Each radio button list obviously has a different Id but all of them have 5 options. What is the best way to accomplish this task?

推荐答案

如果你有10 单选按钮列表和想要做同样的事情为每个可以分类每个的5 列表项和CSS定义颜色。例如，对于两个单选按钮列表：

If you have ten RadioButtonList and want to do same thing for each of those you can classify each of five ListItem and define colors in CSS. example for two RadioButtonList:

<asp:RadioButtonList ID="rbl1" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" SelectedValue='<%#Bind("A1") %>'>
<asp:ListItem runat="server" Text="1" Value="1" class="radiobuttonlist1"/>
<asp:ListItem runat="server" Text="2" Value="2" class="radiobuttonlist2"/>
<asp:ListItem runat="server" Text="3" Value="3" class="radiobuttonlist3"/>
<asp:ListItem runat="server" Text="4" Value="4" class="radiobuttonlist4"/>
<asp:ListItem runat="server" Text="5" Value="5" class="radiobuttonlist5"/>
</asp:RadioButtonList>

---

<asp:RadioButtonList ID="rbl2" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" SelectedValue='<%#Bind("A1") %>'>
<asp:ListItem runat="server" Text="1" Value="1" class="radiobuttonlist1"/>
<asp:ListItem runat="server" Text="2" Value="2" class="radiobuttonlist2"/>
<asp:ListItem runat="server" Text="3" Value="3" class="radiobuttonlist3"/>
<asp:ListItem runat="server" Text="4" Value="4" class="radiobuttonlist4"/>
<asp:ListItem runat="server" Text="5" Value="5" class="radiobuttonlist5"/>
</asp:RadioButtonList>

然后在CSS：

.radiobuttonlist1{
   color:red;
 }
.radiobuttonlist2{
   color:yellow;
 }
.radiobuttonlist3{
   color:green;
 }
.radiobuttonlist4{
   color:magenta;
 }
.radiobuttonlist5{
   color:blue;
 }

这篇关于应用不同的颜色，以一个单选按钮列表的不同项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！