0

我在谷歌浏览器中的图片链接有些困难。当它们被悬停时，图像会出现黑色下划线，我该如何删除这个我试过了

a {
   color: #000;
   &:visited {
      color: #666;
   }
   &:hover {
      outline-style:none;
      box-shadow:none;
      border-color:transparent;
   }
}

和

a {
   color: #000;
   &:visited {
      color: #666;
   }
   &:hover {
      border-style:none;
   }
}

连同许多其他东西，但似乎没有任何效果，css 确实会影响它，但不会影响我想要的效果，任何帮助将不胜感激。

4

2 回答 2

4

下划线来自text-decoration声明，而不是声明border-style。您要正确设置：

a {
  color: #000;

  &:hover {
    text-decoration: none;
  }
}

这是反直觉的，因为您的链接恰好是图像，但声明的目标是环绕您的图像的锚标记。

于 2013-09-13T15:48:36.327 回答
1

我还发现，在生成脚手架时，会在 rails 中创建 assets/stylesheets/scaffold.css.sass。这实际上是我问题的根源。在此处创建了一些默认 css，在 chrome 中添加了黑色下划线，通过删除它，我能够在悬停时删除图像链接上的黑色下划线。此默认 css 可能与您编写的其他样式冲突，因此检查是否也存在与此样式冲突的想法。

于 2013-10-17T07:54:46.340 回答