Установка класса для DIV, который является серверным элементом управления

Question

Я разные стили CSS, один из которых:

#layoutsectiondiv{
    border: 2px dashed #000000; 
   padding: 1px;
    left: 0px;
}

У меня есть страница aspx:

<div id="testDiv" runat="server">

</div>

Если бы это был обычный HTML, я бы установил стиль div, выполнив

<div id="layoutsectiondiv">

</div>

Во время выполнения (в коде) мне нужно динамически назначать разные стили для DIV. Как бы я это сделал?

Answer 1

Используйте свойство class и измените ваши стили CSS, чтобы использовать селекторы класса вместо селекторов id. Например

.layoutsectiondiv{}

<div id="testDiv" class="layoutsectiondiv">
</div>

Редактировать

Создайте свой класс только для того, чтобы применять его к нужным вам элементам div. не используйте ваши классы повторно. Это должно быть легко, поскольку ваш CSS уже привязан к определенному идентификатору, просто поместите этот класс в этот элемент.

Если вы используете этот класс для многих типов элементов, то то, что вы предложили, будет работать нормально.

Answer 2

Таким образом, вы можете использовать селектор идентификатора CSS таким образом.

#layoutsectiondiv { color: red }

со следующим html

<div id="layoutsectiondiv">    
</div>

Или HTML-селектор класса CSS, как это.

.layoutsectiondiv { color: blue }

со следующим html

<div class="layoutsectiondiv">
</div>

Если вы хотите управлять стилем конкретного элемента управления .net, то есть элемента с атрибутом runat = "server", то, как мы знаем, .net будет "искажать" идентификатор, чтобы обеспечить его уникальность.

В этом случае в нашем коде мы можем использовать FindControl для доступа к div и изменить его стиль

<div id="testDiv" runat="server">
</div>

т.

        HtmlGenericControl testDiv =
            (HtmlGenericControl)Page.FindControl("testDiv");

        // to hide
        testDiv.Attributes.Add("style", "display: none");  // OR
        testDiv.Attributes["style"] = "display: none";

        // to show
        testDiv.Attributes.Add("style", "display: block"); // OR
        testDiv.Attributes["style"] = "display: block";

        // or to add a class
        testDiv.Attributes.Add("class", "MyCssClassName"); // OR
        testDiv.Attributes["class"] = "MyCssClassName";

Вот хорошее объяснение разницы между идентификатором CSS и классом - CSS: div id VS. div класс .

А вот для Как редактировать стиль CSS для div с использованием C # в .NET

Answer 3

Джош прав, вы должны использовать класс вместо идентификатора.

на ваш вопрос:

Во время выполнения (в коде позади) мне нужно динамически назначать разные стили DIV. Как бы я это сделал?

попробуйте это:

// layoutsectiondiv is defined as class : .layoutsectiondiv{}
testDiv.Attributes["class"] = "layoutsectiondiv";