更改活动标签的CSS（导航菜单）

Question

我想更改网站上活动标签的样式。

我目前的代码是：

    string pageName = this.ContentPlaceHolder1.Page.GetType().FullName;

    string active1 = "";
    string active2 = "";
    string active3 = "";
    string active4 = "";


    if (pageName == "ASP.default_aspx")
    {
        active1 = "test1";
    }

    else if (pageName == "ASP.kalender_aspx")
    {
        active2 = "test1";
    }

    else if (pageName == "ASP.organisation_aspx")
    {
        active3 = "test1";
    }

    else if (pageName == "ASP.kontakt_aspx")
    {
        active4 = "test1";
    }

    litNav.Text += "<ul class='menusm'>";
    litNav.Text += "<li class='" + active1 + "'><a href='default.aspx'>Nyheder</a></li>";
    litNav.Text += "<li><a class='" + active2 + "'" + "href='kalender.aspx'>Kalender</a></li>";
    litNav.Text += "<li><a class='" + active3 + "' href='#'>Organisation</a></li>";
    litNav.Text += "<li><a class='" + active4 + "' href= '#'>Kontakt</a></li>";
    litNav.Text += "</ul>";

当我把字符串＆＃34; active1＆＃34;在li标签内部，它会更改活动标签上的颜色

但是当我尝试将我的字符串（active2）放入我的＆＃34; a＆＃34;标签，而不是＆＃34; li＆＃34;

它没有回应。

我的CSS

.topnav ul li.current_page_item a {
                    color: #fff;
                    background: #f00 url(../images/menu_a.gif) repeat-x left top;
                    border-left: 1px solid #1d589c;
                    border-top: 1px solid #1d589c;
                    border-right: 1px solid #fff;
                    border-bottom: 1px solid #fff;
                }

我刚做了＃34; Test1＆＃34;用于检测。但我想要使用的课程是.topnav ul li.current_page_item a

Answer 1

理想情况下，您处于正确的轨道上，但是您需要在项目中模拟其中的Javascript实现，以便从HTML中的元素添加/删除类。

I threw together a quick example here of this in this JS Bin.

基本上，您希望为HTML属性分配不同的类，这些类与样式表相关联。在我的例子中，我设置了这样的代码：

<强> HTML：

<button id="testButton" class="unclicked">Button</button>

<强> CSS：

.unclicked {
   background-color: red;
}

.clicked {
   background-color: green;
}

既然已经设置了参数，只需设置逻辑来重新分配类。 **务必在样式中清楚地定义新类的属性，以便正确解释您的更改。