CSS：如何从不直接位于锚标记中的链接中删除下划线？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5207345/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS: how do I remove the underline from a link that isn't directly in the anchor tag?
提问by NullVoxPopuli
<a href="/admin/menu_bars/select">
<div class="action_box right">
Manage Menu Bars
</div>
</a>
a .action_box {
text-decoration: none;
}
doesn't work =\
不起作用=\
回答by Nico Burns
Your code is trying to remove the underline from the div (which probably doesn't have one) rather than the link (which probably does). Simply
您的代码试图从 div（可能没有）而不是链接（可能有）中删除下划线。简单地
a {
text-decoration: none;
}
will work, although that will remove the underline from all links.
会起作用，尽管这会从所有链接中删除下划线。
If you need to be more specific to that link then use
如果您需要更具体地了解该链接，请使用
<a class="action_link" href="/admin/menu_bars/select">
<div class="action_box right">
Manage Menu Bars
</div>
</a>
a.action_link {
text-decoration: none;
}
This assumes that the underline is in fact a text-decorationon the link element and not a border-bottomon the div.
这假设下划线实际上是text-decoration链接元素border-bottom上的a 而不是div 上的a 。
回答by Silence Dogood
You still need to apply the text-decoration style to the outer href tag.
您仍然需要将 text-decoration 样式应用于外部 href 标签。
Example follows:
示例如下：
<html>
<head>
<style>
.noUnderline {
text-decoration: none;
}
</style>
</head>
<body>
<a class="noUnderline" href="/admin/menu_bars/select">
<div class="action_box">
Manage Menu Bars
</div>
</a>
</body>
</html>
回答by chris lewis
Problem is, it's not putting the underline under the text, it's underlining the div. Basically you'd need to define the rule at the anchor still, not for the content inside the anchor:
问题是，它不是将下划线放在文本下方，而是在 div 下划线。基本上，您仍然需要在锚点处定义规则，而不是为锚点内的内容定义规则：
a, a .action_box { text-decoration: none; }
回答by Jeff Andersen
It quite possibly could be an issue of another class / property is overriding your latest attempt; however, try what Silence Dogood said:
很可能是另一个类/属性的问题覆盖了您的最新尝试；然而，试试 Silence Dogood 所说的：
a div .action_box {
text-decoration: none;
}
If that doesn't work we'll need to see the rest of the CSS.
如果这不起作用，我们将需要查看 CSS 的其余部分。
回答by Houston
Can you not just use this.
你能不能不只用这个。
#content > ul {
text-decoration: none;
}
The above obviously is my own.
以上显然是我自己的。
回答by Smita Kagwade
You are trying to remove underline from div which is inside the anchor tag
您正在尝试从锚标记内的 div 中删除下划线
Simply use
只需使用
a{
text-decoration: none;
}
You can give id to anchor tag for better use,
您可以为锚标记提供 id 以便更好地使用，
<a id="linkid" href="/admin/menu_bars/select">
<div class="action_box right">
Manage Menu Bars
</div>
</a>
and use css
并使用 css
a#linkid{
text-decoration: none;
}
