您需要做一些事情来将“当前”类添加到与您已加载的页面对应的列表项中，然后您可以使用您拥有的 CSS 执行以下操作：
.second-level-menu-vertical li a:hover, .second-level-menu-vertical li.current a {
background-color: #FDCC00;
border-radius: 7px;
color: #000;
text-decoration: none;
}
您可以使用 Javascript（在客户端）或在生成菜单的 ASP.NET 代码（通过代码隐藏）中添加该类...我无法建议您哪个更适合您，因为您只包括的CSS。
已编辑
鉴于此标记：
<div class="second-level-menu-vertical">
<ul class="top-level">
<li><a href="K-5th-Grades.aspx">K-5th Grades</a></li>
<li><a href="6th-grade.aspx">6th Grade</a></li>
<li><a href="7th-grade.aspx">7th Grade</a></li>
<li><a href="8th-grade.aspx">8th Grade</a></li>
<li><a href="9th-grade.aspx" class="selected">9th Grade</a></li>
<li><a href="10th-grade.aspx">10 Grade</a></li>
<li><a href="11th-grade.aspx">11th Grade</a></li>
<li><a href="12th-grade.aspx">12th Grade</a></li>
<li><a href="college-checklist.aspx">College Checklist</a></li>
<li><a href="savings-growth-calculator.aspx">Savings Growth Calculator</a></li>
</ul>
</div>
（注意，我在其中放置了一个选定的类来说明......如果您采用 jQuery 或 Javascript 方法，那么它不应该出现在您的标记生成器中。如果您可以将它放入您的标记生成器中，那么它将删除需要Javascript方法！）
这是修改后的CSS：
.second-level-menu-vertical {
float: left;
font:bold 110% 'verdana', sans-serif;
margin-left: -10px;
margin-top: 57px;
text-transform: lowercase;
width: 155px;
z-index: 200;
position: absolute;
}
.second-level-menu-vertical ul {
padding-bottom: 10px;
}
.second-level-menu-vertical li {
background: none;
margin: 0;
padding: 0 0.75em;
}
/* Don't forget LoVe-HAte to set the default styles for non-hover states */
.second-level-menu-vertical li a,
.second-level-menu-vertical li a:link,
.second-level-menu-vertical li a:visited,
.second-level-menu-vertical li a:hover,
.second-level-menu-vertical li a:active {
border-bottom: 1.75px dashed #C9C9C9;
color: #666;
display: block;
padding: 1em 0;
text-decoration: none;
}
.second-level-menu-vertical li a:hover,
.second-level-menu-vertical li a.selected,
.second-level-menu-vertical li a.selected:link,
.second-level-menu-vertical li a.selected:visited,
.second-level-menu-vertical li a.selected:hover,
.second-level-menu-vertical li a.selected:active {
background-color: #FDCC00;
border-radius: 7px;
color: #000;
text-decoration: underline;
}
这是您需要的非常简单的 jQuery。它根据您当前在网站上使用的 URL 做出了几个假设，其中一个是您在任何这些 URL 中都没有查询字符串，并且您将始终以与给定匹配的页面名称结尾菜单中的href。
// you want the path of the location,
// as that should not include the querystring,
// if you have one
var pathGroup = location.pathname.split("/");
// split it by the / character
// then get the last element... this should be your
// current page name
var currentPage = pathGroup[pathGroup.length - 1];
// This selector finds the a tag that
// has an href matching your currentPage
// variable. It then adds a selected class
// to that a tag
var menuItems = $(".second-level-menu-vertical li a[href~='" + currentPage + "']").addClass("selected");
请注意，使用常规 javascript 来实现这一点要复杂一些。上面的示例可以在 jsFiddle ( http://jsfiddle.net/mori57/dDsjf/ ) 上看到，但显然它不会在那里工作（虽然可能更容易阅读），因为它无法链接到您的网站正确。
非 jQuery Javascript 方法（http://jsfiddle.net/mori57/rQXBV/2/）：
// you want the path of the location,
// as that should not include the querystring,
// if you have one
var pathGroup = location.pathname.split("/");
// split it by the / character
// then get the last element... this should be your
// current page name
var currentPage = pathGroup[pathGroup.length - 1];
// get the top level element, and get the first
// element returned, as getElementsByClassName
// returns an array
var sideMenu = document.getElementsByClassName("second-level-menu-vertical")[0];
// get all the li items from that item
var sideLinks = sideMenu.getElementsByTagName("li");
// loop through the list returned
for(var link in sideLinks){
// make sure that you're dealing with an object
if(typeof sideLinks[link] == "object"){
// get the <a/> tag from inside the li
var aTag = sideLinks[link].getElementsByTagName("a")[0];
// get the <a/> tag's href
var href = aTag.getAttribute("href");
if(href == currentPage){
// if the href matches your currentPage
// value, set the class to 'selected'
aTag.setAttribute("class","selected");
}
}
}