0

这只发生在 Google chrome 中，我使用的是 chrome 17.0.928 版本。这在 Firefox 中运行良好，但在 google chrome 中出现蓝色下划线。

.thumbnail:hover{z-index: 50;text-decoration: none;position:relative;}
.thumbnail span{  position: absolute;background:#000;padding: 5px;left: -1000px;
 border: 0px solid #ddd;visibility: hidden;color: #fff;width:388px;height:190px;text-decoration: none;}
.thumbnail:hover span{ text-align:left;visibility: visible;top: 0;left: 110px;text- decoration:none; 
 top:-120px;-webkit-box-shadow: 0 8px 6px -6px #aaa; -moz-box-shadow: 0 8px 6px -6px   #aaa;box-shadow: 0 8px 6px -6px #aaa;}
.hoverbold {
text-decoration: none;
font-family: verdana;
font-size: 11px;
color: #B09F6E;
} ​

http://jsfiddle.net/NW8Nw/3/

4

4 回答 4

3

其实很简单。您必须将链接样式分开，我用它摆脱了它

.thumbnail a:link {
    text-decoration: none;       
}

你应该对a:hover,a:visited和做同样的事情a:active。

编辑：
很久以后，我意识到你可以只用一个选择器来做到这一点： 

.thumbnail a { text-decoration: none; }
于 2012-07-25T17:58:11.647 回答
2

删除链接每个状态的装饰

a:link, a:visited, a:hover, a:active
{text-decoration:none;}
于 2012-07-25T17:58:41.810 回答
2

简单地：

.thumbnail a {
    text-decoration: none;
}

附带说明一下，您的标签中有多个<div>s 。标签应该只包含内联元素。<a><a>

于 2012-07-25T18:01:12.160 回答
0

好吧，我遇到了同样的问题，由于找不到可能的解决方案，所以我这样做了。

div {
      text-decoration:underline;
      text-decoration-color:white;
    }

在这里，您的 text-decoration-color 和 background-color 应该相同，从而隐藏了蓝色下划线。希望这可以帮助

于 2017-06-07T03:41:33.403 回答