C# .NET 网站 - 将 CSS 类添加到菜单元素

Question

我使用 PHP 已经有 7 年左右的时间了，但从今天起我开始在一个项目中使用 .NET。仅用于网站：

该项目具有：

.NET4 Viewstate = false

现在我的问题是这样的。主要布局被母版页覆盖，看起来很明显它是如何工作的。它还包括导航菜单选项，例如：

<div id="menu">
    <ul>
        <li><a href="default.aspx" title="Home" >Home</a></li>
        <li><a href="products.aspx" title="Products">Products</a></li>
        <li><a href="prices.aspx" title="Size &amp; Price">Size &amp; Price</a></li>
        <li><a href="formats.aspx" title="File Formats">File Formats</a></li>
    </ul>
</div>

现在我想做的是根据我所在的页面添加 CSS 类属性，因此如果我在产品页面上，我会得到以下来源：

<div id="menu">
    <ul>
        <li><a href="default.aspx" title="Home" >Home</a></li>
        <li><a href="products.aspx" class="active" title="Products">Products</a></li>
        <li><a href="prices.aspx" title="Size &amp; Price">Size &amp; Price</a></li>
        <li><a href="formats.aspx" title="File Formats">File Formats</a></li>
    </ul>
</div>

任何帮助将不胜感激！

干杯:)

Answer 1

有很多方法可以做到这一点，一种方法是将脚本添加到“从属”页面，以设置适当标签的类。

<li><a href="default.aspx" title="Home" id="aHome" >Home</a></li>
<li><a href="products.aspx" title="Products" id="aProducts">Products</a></li>

然后在 products.aspx 中你可以执行以下操作：

<SCRIPT>document.getElementById('aProducts').setAttribute('class', 'active');</SCRIPT>

Answer 2

这不是你问题的答案，但这是在CSS类别中，所以我想我至少应该发表评论:)

我强烈建议你在每个列表项上设置静态类，并与CSS中的主体类相结合，使用类似于：

<style type="text/css"><!--
    body.products #menu li.products a,
    body.otherpage1 #menu li.otherpage1 a,
    body.otherpage2 #menu li.otherpage2 a,
    body.otherpage3 #menu li.otherpage3 a,
    body.otherpage4 #menu li.otherpage4 a, { /* your styles here*/ }
--></style>

我认为使用 C# 来只是设置一个类有点矫枉过正，仅此而已:)

Answer 3

我首先将链接转换为服务器控件。请参阅 MSDN 页面了解。从那里，我将为我的 MasterPage 创建一个接口，这样，如果我将来需要更改 MasterPage，我可以实现相同的接口，而不必担心破坏我的构建（我们将公开公开一些属性）下一步，所以这会有用）。

public interface IMasterPage
{
    String LnkHomeClass { get; set; }
    String LnkProductsClass { get; set; }
    ...
} 

现在，正如我提到的，在母版页的代码隐藏中公开超链接的 CssClass 属性。

public string LnkProductsClass
{
    get 
    {
        return LnkProducts.CssClass;    
    }
    set
    {
        LnkProducts.CssClass = value;
    }
}

现在您可以在子页面上设置这些。

IMasterPage masterPage = Master as IMasterPage;
if (masterPage != null)
{
    masterPage.LnkProductsClass = “active”;
} 

另一种选择，但我不太熟悉，可能是使用 嵌套 MasterPages< /a>.