Применение стилей к элементам списка в CheckBoxList

Question

Как стили могут быть применены к CheckBoxList ListItems. В отличие от других элементов управления, таких как Repeater, где вы можете указать <ItemStyle>, вы не можете указать стиль для каждого отдельного элемента управления.

Есть ли какая-то работа вокруг?

Answer 1

Вы можете программно добавлять атрибуты в ListItems следующим образом.

Скажем, у вас есть CheckBoxList и вы добавляете ListItems. Вы можете добавить атрибуты по пути.

ListItem li = new ListItem("Richard Byrd", "11");
li.Selected = false;
li.Attributes.Add("Style", "color: red;");
CheckBoxList1.Items.Add(li);

Это сделает цвет текста списка элементов красным. Экспериментируйте и получайте удовольствие.

Answer 2

Кажется, лучший способ сделать это - создать новый CssClass. ASP.NET переводит CheckBoxList в структуру таблицы.

Используя что-то вроде

style.css

.chkboxlist td 
{
    font-size:x-large;
}

Page.aspx

<asp:CheckBoxList ID="chkboxlist1" runat="server" CssClass="chkboxlist" />

сделает свое дело

Answer 3

В дополнение к ответу Андрея ...

В зависимости от того, какие другие атрибуты вы добавили в CheckBoxList или RadioButtonList или что-то еще, ASP.Net будет отображать выходные данные, используя разные структуры. Например, если вы установите RepeatLayout="Flow", он не будет отображаться как TABLE, поэтому вы должны быть осторожны с тем, какие селекторы-потомки вы используете в своем файле CSS.

В большинстве случаев вы можете просто выполнить «Просмотр исходного кода» на отображаемой странице, возможно, в нескольких различных браузерах, и выяснить, что делает ASP.Net. Однако существует опасность, что новые версии серверных элементов управления или другие браузеры будут отображать их по-разному.

Если вы хотите по-разному стилизовать определенный элемент списка или набор элементов списка без добавления атрибутов в выделенном фрагменте кода, вы можете использовать селекторы атрибутов CSS. Единственным недостатком является то, что они не поддерживаются в IE6. jQuery полностью поддерживает селекторы атрибутов стиля CSS 3, так что вы, вероятно, также можете использовать его для более широкой поддержки браузера.

Answer 4

Вы также можете добиться этого в разметке.

<asp:ListItem Text="Good" Value="True" style="background-color:green;color:white" />
<br />
<asp:ListItem Text="Bad" Value="False" style="background-color:red;color:white" />

Слово Стиль будет подчеркнуто с предупреждением о том, что Атрибут 'style' не является допустимым атрибутом элемента 'ListItem'. , но элементы в любом случае отформатированы как требуется.

Answer 5

Вы можете даже иметь разные стили шрифта и цвет для каждого слова.

<asp:ListItem Text="Other (<span style=font-weight:bold;>please </span><span>style=color:Red;font-weight:bold;>specify</span>):" Value="10"></asp:ListItem>

Answer 6

public bool Repeater_Bind()
{
    RadioButtonList objRadioButton = (RadioButtonList)eventArgs.Item.FindControl("rbList");
    if (curQuestionInfo.CorrectAnswer != -1) {
        objRadioButton.Items[curQuestionInfo.CorrectAnswer].Attributes.Add("Style", "color: #b4fbb1;");
    }
}