2

我写了一个自定义 HtmlHelper 来应用......

class = "active"

如果这是当前页面，则添加到菜单项。查看源代码后，我知道这可以正常工作，但在我当前的设置中，我似乎无法针对 .active 类对其应用任何样式。

当前的 HTML

<ul id="menu">
    <li>@Html.MenuItem("Home", "Index", "Home")</li>
    <li>@Html.MenuItem("About", "About", "Home")</li>
</ul>

当前的 CSS

#menu { width: 100%;
      padding: 0;
      margin: 0;
      list-style-type: none;
      padding-top: 6px; }

#menu a { width: 100%;
            font-weight: bold;
            text-decoration: none;
            color: #ffffff;
            padding: 6px 8px 6px 8px;
            text-shadow: 1px 1px 1px #8292a2; }

#menu a:hover { background-color: #e8eff6; color: #2a3744; text-shadow: 1px 1px 1px #e8eff6; }

#menu li { display: inline; }

我假设我在这里遇到了一个特殊性问题，但我似乎无法针对“活动”类应用任何类型的样式。

#menu a.active
#menu li a.active

似乎没有任何效果。有任何想法吗？

编辑： 我正在使用的自定义 HtmlHelper

public static class MenuExtensions
    {
        public static MvcHtmlString MenuItem(
            this HtmlHelper htmlHelper,
            string text,
            string action,
            string controller
        )
        {
            string value;
            var routeData = htmlHelper.ViewContext.RouteData;
            var currentAction = routeData.GetRequiredString("action");
            var currentController = routeData.GetRequiredString("controller");
            if (string.Equals(currentAction, action, StringComparison.OrdinalIgnoreCase) &&
                string.Equals(currentController, controller, StringComparison.OrdinalIgnoreCase))
            {
                value = htmlHelper.ActionLink(text, action, new { controller = controller }, new { @class = "active" }).ToHtmlString();
                return MvcHtmlString.Create(value.ToString());
            }

            value = htmlHelper.ActionLink(text, action, controller).ToHtmlString();
            return MvcHtmlString.Create(value.ToString());
        }
    }

通过查看源代码输出 HTML

<ul id="menu">
   <li><a class="active" href="/">Home</a></li>
   <li><a href="/Home/About">About</a></li>
</ul>

正如我所说，我知道它正在工作，即使它存在，我似乎也无法针对“活动”类......

4

1 回答 1

3

你放了a.active，你应该像悬停一样使用“：”。a:active

编辑：在重新阅读您的问题之后，您的意思是用于链接到用户当前所在页面的菜单项的自定义 CSS 类吗？在这种情况下，按照我使用 ASP 的方式，它会自动为您处理这些菜单项。否则，我看不到您将该类分配给菜单项的位置？这肯定是第一个问题。

于 2012-04-09T22:16:49.513 回答