Question

我正在尝试动态更改代码中的CSS类面板。

我使用DIV和runat="server"与div.Attributes["class"]="myClass"进行了尝试。没有成功。

然后我去了asp面板。 myPanel.cssClass = "myClass" ......没有成功。

我也尝试过AnthonyWJones的解决方案： Best way to change CSS Classes from code 用：

myPanel.RemoveCssClass("arrow_box");
myPanel.AddCssClass("arrow_boxMS");

仍然没有成功。

我唯一想改变的是div的箭头。我帮助自己（生成CSS）： http://cssarrowplease.com/

我的CSS：

.arrow_box, .arrow_boxMS
{
    position: relative; /*background: #88b7d5;*/
    border: 2px solid #c2e1f5;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-top: 15px;
    z-index: -1;
}
.arrow_box:after, .arrow_box:before
{
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute; /*pointer-events: none;*/
}
.arrow_box:after
{
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #ffffff; /*#88b7d5;*/
    border-width: 15px; /*SET height of smaller triangle within arrow. IMPORTANT bigger triangle is set in .arrow_box:before class*/
    left: 8%;
    margin-left: -15px;
}
.arrow_box:before
{
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: #c2e1f5;
    border-width: 18px; /* SET height of bigger triangle - arrow IMPORTANT: difference between triangles must reflect how many pixels is border*/
    left: 8%;
    margin-left: -18px; /*if border thickness is changed adjust this to fit triangles*/
}

.arrow_boxMS:after, .arrow_boxMS:before
{
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute; /*pointer-events: none;*/
}
.arrow_boxMS:after
{
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #ffffff; /*#88b7d5;*/
    border-width: 15px; /*SET height of smaller triangle within arrow. IMPORTANT bigger triangle is set in .arrow_box:before class*/
    left: 25%;
    margin-left: -15px;
}
.arrow_boxMS:before
{
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: #c2e1f5;
    border-width: 18px; /* SET height of bigger triangle - arrow IMPORTANT: difference between trinagles must reflect how many pixels is border*/
    left: 25%;
    margin-left: -18px; /*if border thickness is changed adjust this to fit triangles*/
}

单击按钮时，三角形不会改变。

有什么想法吗？

编辑：

<asp:UpdatePanel runat="server">
                <ContentTemplate>
                    <table id="tblSelection">
                        <tr>
                            <td>
                                <asp:Button ID="btn1" Text="1" CssClass="button" ClientIDMode="Static"
                                    runat="server" OnClick="btn1_Click" />
                            </td>
                            <td>
                                <asp:Button ID="btn2" Text="2" CssClass="button" ClientIDMode="Static"
                                    runat="server" OnClick="btn2_Click" />
                            </td>
                            <td>
                                <asp:Button ID="btn3" Text="3" CssClass="button" runat="server" OnClick="btn3_Click" />
                            </td>
                            <td>
                                <asp:Button ID="btn4" Text="4" CssClass="button" runat="server"
                                    OnClick="btn4_Click" />
                            </td>
                            <td>
                                <asp:Button ID="btn5" Text="5" CssClass="button" runat="server"
                                    OnClick="btn5_Click" />
                            </td>
                            <td>
                                <asp:Button ID="btn5" Text="5" CssClass="button" runat="server" OnClick="btn5_Click" />
                            </td>
                        </tr>
                    </table>
                </ContentTemplate>
            </asp:UpdatePanel>

            <asp:Panel id="divDaySelection" runat="server">           
                        <table id="tblDaySelection">
                            <tr>
                                <td>
                                    <asp:CheckBox ID="cbAllDays" Text="All" runat="server" 
                                        oncheckedchanged="cbAllDays_CheckedChanged" AutoPostBack="true" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbMon" Text="Monday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbTue" Text="Tuesday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbWed" Text="Wednesday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbThu" Text="Thursday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbFri" Text="Friday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbSat" Text="Saturday" runat="server" />
                                </td>
                                <td>
                                    <asp:CheckBox ID="cbSun" Text="Sunday" runat="server" />
                                </td>
                            </tr>
                        </table>

            </asp:Panel>

似乎像updatepanel一样有问题，因为我现在正在收到结果......现在我删除了它。

Answer 1

问题是该面板不在更新面板中......

Answer 2

因为我（在编辑期间）和岩石想出来的问题是该面板不在更新面板中。

从技术上讲，我所有改变CSS的方法都可行。

更改面板的CSSclass

2 个答案: