如何将CSS应用于ASP.NET CheckBoxList控件的内部元素

Question

我需要操作ASP.NET CheckBoxList控件内的label元素的属性。每个复选框标签都需要有不同的类别。我看到的最好的选择是在事后使用jQuery来应用这些类。有谁知道更好的方法？

我发现this post轻微的帮助，但是，添加属性的列表项只包裹input元素，并在span标签与标记属性label元素。

Answer 1

也许您已经考虑过了，但您可以尝试使用ASP.NET控制适配器。控制适配器可让您更改ASP.NET控件生成的HTML标记。

结帐以下链接的介绍：

• ASP.NET Quicky: Control adapters
• Simple Introduction to ASP.NET Control Adapters
• ASP.NET 2.0 CSS Friendly Control Adapters: The White Paper
• MSDN Magazin Article on Control Adapters

Answer 2

这可能是一种黑客，因为我不熟练w/CSS，但它为我工作。

为复选框列表中的每个列表项目上的每个项目分别添加一个ID属性。这将为包装标签标签的每个跨度分配一个ID。你会想为每个列表项分配一个不同的ID，因为你说每个都需要一个不同的类。

For Each li As ListItem In Me.CheckBoxList1.Items 
    li.Attributes.Add("id", "mySpanID") 
Next 

现在您需要为此ID添加CSS样式，因此它适用于标签标签。

<style> 
    #mySpanID label { color: Blue } 
</style> 

另一种方式是做同样的事情之上，但将类分配给每个列表项，并有类只适用于标签标记。

分配类各列表项

For Each li As ListItem In Me.CheckBoxList1.Items 
    li.Attributes.Add("class", "MyClass") 
Next 

，然后添加你的CSS

<style> 
    .MyClass label {color: Blue} 
</style> 

Answer 3

因此，我认为这样做的几种不同的方式。首先是通过CSS类。

服务器代码：

List<ListItem> items = new List<ListItem>(); 
ListItem item1 = new ListItem("test", "test"); 
item1.Attributes.Add("class", "specificClass1"); 
items.Add(item1); 
//repeat the last three lines as needed 
checkBoxList.Items.AddRange(items.ToArray()); 

这将导致，像你说的，包含标签和输入元素的跨度。所以，你的css应该是：

.specificClass1 label 
{ 
    //Your specific css 
} 

你会根据需要重复这一点。

另一种方法是jQuery方法。我没有看到这种方法有什么问题，但是在你的问题上，你提到这种方法是消极的。所以我会假设你知道如何去做，但不想。我只是提到它说这不是一个坏方法，如果一切都失败了，你可能需要重新考虑:)。

Answer 4

比利的第二个答案的变化，但没有服务器端代码：

分配类的CheckBoxList本身

<asp:CheckBoxList runat="server" id="MyCBL" CssClass="MyClass"></asp:CheckBoxList> 

应用到父元素（在这种情况下的CheckBoxList，它呈现为一个表）任何CSS可以传递给它的子元素：

<style> 
    .MyClass label {color: Blue} 
    .MyClass input[type='checkbox'] {background-color: Red} 
</style>