为什么这个 css 不删除文本装饰？答案

【问题标题】：Why doesn't this css remove text-decoration?为什么这个 css 不删除文本装饰？
【发布时间】：2015-06-23 23:09:00
【问题描述】：

我有一个有标题的帖子。我这样选择=>

<h4><strong><%= link_to post.title, post, :class => "post-title" 
%></strong></h4>

我想去掉默认情况下作为链接的文本装饰。所以我在我的帖子中有这个 css =>

.post-title  {
text-decoration: none;
 }

我尝试过以各种不同的方式选择文本，但我就是无法让文本装饰消失..

html 输出只是带有标准文本装饰的帖子标题（带有下划线的蓝色）

我检查了 safari web 检查器，但我的任何规则都没有被覆盖。

【问题讨论】：

html 输出是什么
您是否通过 web 检查器检查了此元素以检查此 css 规则是否被其他规则覆盖？顺便试一下a.post-title { text-decoration: none; }
如果您发布生成的 HTML，而不是后端代码，您将获得更好的帮助。然后删除与 Css 问题无关的标签。

【解决方案1】：

当我给 erb 一个 post-title 的 id 并在我的 css 中执行以下操作来选择它时，它起作用了：

a#post-title {
    text-decoration: none;
 }

【讨论】：

【解决方案2】：

试试……

a.post-title {text-decoration: none;}

您的选择器中没有足够的CSS specificity。

将有一个浏览器或重置样式表将文本修饰应用于锚元素，您的样式表将其应用于具有“post-title”类的任何内容。目前主播风格获胜。

例子

a {text-decoration: underline} //Browser CSS
.post-title {text-decoration: none} //Your CSS

这两个都适用于...

a.post-title

【讨论】：