Question

我的页面上有一个Html.ActionLink，我正在使用下面的CSS给它一个图像并尝试删除下划线.....

a.searchButton
{
    background-image: url(/content/images/DropAcross.png);
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
    display: block;
    text-decoration: none;
    clear:none;
}

有人能看到这个问题吗？所有CSS属性似乎都与文本修饰无关：无，这似乎留下了下划线。

Answer 1

你必须查看渲染的html。在Firefox或Google Chrome中，右键单击并选择Inspect Element。

您可能会发现一些愚蠢的事情，就像searchButton类被应用于包装a标签的span一样，在这种情况下，除了链接特定规则之外，您将获得所有工作：

text-decoration:none;

Answer 2

我知道这是一个古老的主题，但也许有人会认为它有用 -
＆＃34;文字修饰＆＃34;上面提到的属性可以通过以下结构传递给ActionLink：

@Html.ActionLink("Display_Name","Action_Name",null,new {style="text-decoration:none;"})

Answer 3

设置text-decoration:none;应该有效。

是否可能有其他一些样式覆盖它？您是否查看过Firebug（或类似工具）以查看正在应用的样式？

一个可能的答案可能是:hover，:visited和:active伪类。如果它们设置为下划线，则它们将覆盖元素的默认样式。

从Html.ActionLink中删除下划线

3 个答案: