Question

我有这个问题，我的导航链接在悬停时有下划线。我试着放置文字装饰：无。我查看了我的整个CSS，但我找不到下划线的原因。

所以我使用了firebug并检查了一个特定位置的css，它给了我下划线。我得到的这个css不是我自己的。

@font-face {
    font-family: "EB Garamond";
    font-style: normal;
    font-weight: 400;
    src: local("EB Garamond"), local("EBGaramond"), url("http://themes.googleusercontent.com/static/fonts/ebgaramond/v4/kYZt1bJ8UsGAPRGnkXPeFYbN6UDyHWBl620a-IRfuBk.woff") format("woff");
}

我的问题是如何更改此样式？这种风格是什么？

Answer 1

解决问题的最快方法是在css选择器中使用text-decoration:none !important;，最好是特定的选择器。

该css指定要使用的自定义字体，指定从哪里记录（http://themes.googleusercontent.com/）以及使用时的默认设置（如字体粗细）。然后，只要将font-face设置为EB Garamond，它就会加载这些默认值。由于此类列在此处，因此不对下划线负责。

Answer 2

它可能是覆盖风格的其他任何地方。用以下内容覆盖它：

a:hover{
    text-decoration:none !important;
}

重要告诉浏览器覆盖其他样式表

Answer 3

如果你不想要下划线，你还必须将CSS更改为text-decoration：none on anchor tag（或其类或id）本身以及hover，active和visited伪类。链接。像这样：

a, a:visited, a:hover, a:active {
    text-decoration: none;
}

您可以将类似这样的选择器用于类（其中类应用于标记）

.class, .class:visited, .class:hover, .class:active

或像这样的id（其中a标签具有此id）

#id, #id:visited, #id:hover, #id:active

使用asp-C＃issue with text-decoration：none;

3 个答案: