ASP.NET MVC Html.ActionLink 超链接颜色

Question

如何更改由助手函数Html.ActionLink创建的超链接的颜色?

[额外细节] 每个超链接状态的颜色都必须不同，即活动的、选定的、已经选定的等。

- Ronald

Answer 1

通常你会这样做：

Html.ActionLink("My Link", "MyAction", null, new { @class = "my-class" })

然后使用CSS来设计 my-class：

a.my-class { color: #333333 }
a.my-class:active { color: #666666 }
a.my-class:link { color: #999999 }
a.my-class:visited { color: #CCCCCC }

- dahlbyk

Answer 2

ActionLink()方法是重载的。其中一些签名允许传递参数object htmlAttributes。

你可以像这样操作：

Html.ActionLink("foo", "bar","baz",   
            new { id = 1}, //   Route args if needed; null if not.
            new {@style="color:#000aaa;" }
            );

也许你已经定义好了一个 CSS 类：

Html.ActionLink("foo", "bar","baz",   
            new { id = 1}, //   Route args if needed; null if not.
            new {@class="MyClass;" }
            );

- p.campbell

---

谢谢，我会尝试一下。我的问题是，如果这个例子能够工作，超链接只会有一种颜色（可能）。超链接有不同的状态，比如活动的、选中的等等。我需要它们有不同的颜色。 - Ronald

@Ronald - 你只需要添加正确的CSS选择器，就像在标准HTML中所做的那样。有成千上万的文章讨论这个问题，应该很容易找到。 - Erik Funkenbusch

Answer 3

以下是基于@dahlbyk答案的一些解释：

• a:link - 正常、未访问过的链接
• a:visited - 用户已访问过的链接
• a:hover - 鼠标悬停在链接上时的状态
• a:active - 点击链接时的状态

当设置多个链接状态的样式时，有一些顺序规则：

• a:hover必须在a:link和a:visited之后
• a:active必须在a:hover之后

更多详细信息可以在这里找到。

- Carlos Liu

---

您关于规则排序的评论让我避免了沮丧。谢谢您。 - SJaka

@SJaka 不客气;-) - Carlos Liu

Answer 4

尝试一下，这种方式对某些人也会有帮助。

Html.ActionLink("Your Link", "YourAction")

<style>   
  a{
        color: #FF5722;
        text-decoration: none;
    }

//if needed hover
  a:hover {
            color: #FF5722;
     }
//Likewise active,visited
</style>

- Niroshan Kumarasamy